模型更改时触发更改事件

我需要在模型值更改的所有SELECT元素上触发'更改'javascript事件。模型的值通过范围以编程方式更改，因此使用ngChange不在场（仅对用户创建的值更改作出反应）。模型更改时触发更改事件

请帮忙吗？

代码示例：PLNKR

var app = angular.module('plunker', []); 
 

 
app.controller('MainCtrl', function($scope) { 
 
    $scope.name = 'oldname'; 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="plunker"> 
 
<div ng-controller="MainCtrl"> 
 
    <p>Hello {{name}}!</p> 
 
    <select ng-model="name" class="myInput" onChange="alert('changed');" > 
 
     <option value="oldname">oldname</option> 
 
     <option value="newname">newname</option> 
 
    </select> 
 
    <button ng-click="name='newname'">Change by Anguar</button> 
 
    </div> 
 
    </div>

选择选择选项显示警报。当我点击按钮时，值（模型）确实发生了变化，但没有显示警报，因为模式更改不会触发“更改”事件。

来源

2016-08-17 Jakub Kolčář

请分享您的代码调试容易 –

@NagaSaiA加质疑。 –

请在问题本身中包含所有必要的代码以回答问题，而不是在第三方网站上。 –

onChange是一个javascript事件处理程序，并不依赖于angular的摘要循环。尝试使用ng-change代替。

来源

2016-08-17 18:53:17 Dacheng

正如我所说的，ngChange只对用户所做的更改作出反应。当模型以编程方式更改时，它不会触发。更多角度文档。 –

$ watch（）怎么样？ –

@AnirudhMangalvedhekar你会提供一个例子吗？我需要这个代码是一般的 - 例如 - 不要使用任何特定的模型。而是为了处理所有这些问题。 –

可以使用$范围。$腕表观看模型，并触发change事件的变化

$scope.$watch('name', function(){ 
    //slct is the id for the select 
    $('#slct').trigger('change'); 
    })

看到plnkr

来源

2016-08-17 19:02:22

或查看https://plnkr.co/edit/Aq1mQm1vyv3bSIWVdKHs?p=preview –

是的，谢谢，这在大多数情况下都可以使用。但我需要我的代码是一般的。也就是说，我有许多模型与他们有很多共同的元素，我不能为所有人编写单一的观察声明。（$（'select'）。val（），function（）{ $（this）.trigger（'change'）; }）如果可以这样做： '$ rootScope。$ watch ;' –

您可以为更通用的解决方案创建自定义指令，请参阅https://plnkr.co/edit/VYMBA9gac8TUFsqtB16x?p=preview –

模型更改时触发更改事件

回答

相关问题