ng-change不适用于带有选项的ng-repeat，但适用于ng-options

I have created select options with ng-repeat, but the function set with on-change is never called.

我已经使用ng-repeat创建了选项，但是永远不会调用带有on-change的函数。

<select>
<option ng-model="level1Selected" ng-repeat="item1 in level1" ng-change="setLevel2()" value="{{item1}}">{{item1}}</option>

I recreated the same thing with ng-options, and the function gets called:

我使用ng-options重新创建了相同的东西，并调用了该函数：

<select ng-options="item1 for item1 in level1" ng-model="level1Selected" ng-change="setLevel2()"></select>

I have checked the documentation, and I see no reason for this difference. The variable level1 is an array of strings, so I don't understand why they behave differently.

我检查了文档，我认为没有理由存在这种差异。变量level1是一个字符串数组，所以我不明白它们为什么表现不同。

The function is currently just a placeholder with console.log:

该函数目前只是一个带有console.log的占位符：

$scope.setLevel2 = function() {
    console.log("value: ");
}

2 个解决方案

#1

If you want to do that you need to put ng-model and ng-change in select tag, try this:

如果你想这样做，你需要在选择标签中加入ng-model和ng-change，试试这个：

<select ng-model="level1Selected" ng-change="setLevel2()">
    <option ng-repeat="item1 in level1"  value="{{item1}}">{{item1}}</option>
</select>

#2

You need trigger ng-change directive to select element.

您需要触发ng-change指令来选择元素。

The ng-change event is triggered at every change in the value.

每次更改值时都会触发ng-change事件。

Here is a working solution: jsfiddle

这是一个有效的解决方案：jsfiddle

 <select ng-model="level1Selected"  ng-change="setLevel2()">
    <option  value="{{item1}}">{{item1}}</option>
 </select>

$scope.setLevel2 = function() {
   alert();
}

#1