Question

我有一个按钮，当前将所选值传递给removeContract()。

<td class="col-md-1" colspan="1" style="text-align: center; vertical-align: middle;">
    <button class="btn btn-primary" data-ng-click="removeContract(ctrl.selectValue, contractIndex)">&nbsp;<=&nbsp;</button>
</td>
<td class="col-md-5" colspan="5">
    <label class="control-label">{{item.fields[132].displayName}}</label>
    <select size="5" ng-model="ctrl.selectValue">
        <option data-ng-repeat="contract in contracts">{{contract.CONT_ORDNO}} - {{contract.SUPP_NAME}}[{{contract.SUPP_NUM}}]</option>
    </select> 
</td>

但是，我需要发回实际的当前合同模型，上面称为“合同”。函数的第一个参数需要是当前选择的合约。我怎么做到这一点？

Answer 1

根据当前代码提出的一些建议：

不要将整个{{contract.CONT_ORDNO}} - {{contract.SUPP_NAME}}[{{contract.SUPP_NUM}}]传递到ng-model中，只需传递contract.CONT_ORDNO即可从下拉列表中识别所选数据。
```
<option data-ng-repeat="contract in contracts" value="contract.CONT_ORDNO">{{contract.CONT_ORDNO}} - {{contract.SUPP_NAME}}[{{contract.SUPP_NUM}}]</option>
```
因为我们已经在控制器内部拥有契约对象数组。因此，无需在 removeContract 函数内传递第二个参数。
```
<button class="btn btn-primary" data-ng-click="removeContract(ctrl.selectValue)">&nbsp;&lt;&#61;&nbsp;</button>
```
根据所选值，我们可以借助Array filter()方法从contract函数中的contracts数组中删除removeContract对象。

<强>样本

var myApp = angular.module('myApp',[]);

myApp.controller('MyCtrl', function($scope) {
    $scope.contracts = [
      {
        "CONT_ORDNO": "1",
        "SUPP_NAME": "alpha",
        "SUPP_NUM": "0001"
      },
      {
        "CONT_ORDNO": "2",
        "SUPP_NAME": "beta",
        "SUPP_NUM": "0002"
      },
      {
        "CONT_ORDNO": "3",
        "SUPP_NAME": "gaama",
        "SUPP_NUM": "0003"
      },
      {
        "CONT_ORDNO": "4",
        "SUPP_NAME": "xyz",
        "SUPP_NUM": "0004"
      }
    ];
    
    $scope.removeContract = function(selectedVal) {
      var removedObj = $scope.contracts.filter(function(item) {
        return item.CONT_ORDNO != selectedVal; 
      });
      console.log(removedObj);
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="MyCtrl">
  <td class="col-md-1" colspan="1" style="text-align: center; vertical-align: middle;">
    <button class="btn btn-primary" data-ng-click="removeContract(ctrl.selectValue)">&nbsp;&lt;&#61;&nbsp;</button>
</td>
<td class="col-md-5" colspan="5">
    <label class="control-label">{{item.fields[132].displayName}}</label>
    <select size="5" ng-model="ctrl.selectValue">
        <option data-ng-repeat="contract in contracts" value="{{contract.CONT_ORDNO}}">{{contract.CONT_ORDNO}} - {{contract.SUPP_NAME}}[{{contract.SUPP_NUM}}]</option>
    </select> 
</td>   
</div>

在按钮按下/事件触发器上传递所选对象模型

1 个答案: