Question

使用Angular 1.x，我有两组选择框，都在更改时调用一个函数：

ng-click="checkOneOptionSelected()"

在我的控制器中，我想知道哪一组选择框称为函数：

$scope.checkOneOptionSelected = function(value){ 

      .. do something...

}

有没有一种方法可以动态获取ng-model的值而无需将字符串作为参数传递，也许使用'this'或类似的方法。将值硬编码为参数会起作用，但是感觉很hacky？

Answer 1

您可以传递ng-click reference内置的$event对象（在iQuery event object中提到）。

ng-click="checkOneOptionSelected($event)"

然后使用其target字段来说明被点击的内容：

$scope.checkOneOptionSelected = function(event){ 

      .. do something with event.target, e.g...
      if(event.target.id == 'Option123') {
          ...
      }

}

Answer 2

使用ng-model指令时，代码应使用ng-change指令而不是ng-click。

<select ng-model="$ctrl.sel1" ng-change="$ctrl.updateSel('sel1',$ctrl.sel1)"
        ng-options="...">
  <option value="">Select sel1</option>
</select>

<select ng-model="$ctrl.sel2" ng-change="$ctrl.updateSel('sel2',$ctrl.sel2)"
        ng-options="...">
  <option value="">Select sel2</option>
</select>

要共享相同的更新功能，只需添加参数以指示更改的来源。

this.updateSel = function (id, val) {
    console.log(id,val);
    //...
};

ng-click指令与ngModelController战斗。 ng-change指令使用ngModelController的{{3}}属性。 ngChange表达式仅在输入值的更改导致将新值提交给模型时评估。

有关更多信息，请参见

$viewChangeListeners。

在<select>更改函数中的Angular ng-model动态查找

2 个答案: