javascript - on-change 和 ng-change 的区别

下面是一个相当简单的表单下拉列表设置。但是，on-change 事件就是无法触发……除非将其改为 ng-change。

这让我卡了大约一个小时，因为我们在网站的其他地方也使用相同的设置（即模型属性/列表/on-change 指令），而且总是成功的。

我想知道 on-change 和 ng-change 之间的区别是什么，以及为什么在这个情况下一个有效而另一个无效？

查看

<select id="grArchive"
        name="grArchive"
        class="form-control"
        options="userList"
        ng-model="selectedUser"
        ng-options="user as user.name for user in userList"
        on-change="showSelected()">
</select> 

控制器

scope.selectedUser = {};
scope.userList = [];

scope.showSelected = function(){
    scope.columns = addColumns;
};

var loadUserList = function(data){
    scope.userList = $.map(data, function(item){
            return {id: item.id, name: item.firstName + ' ' + item.lastName};
        });
}

以防万一：用户下拉菜单如预期显示（截图如下）

答案＃1

ng-change

ng-change 是 Angular 核心 API 提供的一个指令，它在 ng-model 变量的 $viewValue 发生任何变化时，会内部注册一个表达式调用（这里是代码）；为它分配一个表达式，如 myFunction()。该提供的表达式将在底层控制器的作用域内求值。调用表达式后，它会运行一次 digest 循环，以确保视图上的绑定被更新。除了 ng-change 之外，还有其他用于事件的指令，例如 ng-focus、ng-mousedown、ng-submit、ng-blur 等。这里 是这些指令的列表

在变化时

这是一种在输入元素值发生 change 时调用 JavaScript 函数的方式。它会搜索在上下文中全局可用的 function（显然它不会调用注册在 angular 控制器中的函数）并对其进行求值。