当我从纯 JavaScript 更改输入元素的值时， Angular 模型不会更新。有没有办法通过在更改后手动触发某些事件来以某种方式触发此更新？
<body ng-controller="MainCtrl">
<script>
function changeValue() {
var e = document.getElementById("field");
e.value = "updated value";
}
</script>
field: <input type="text" id="field" ng-model="field">{{field}}
<br>
<button onclick="changeValue()">Change the value</button>
</body>
完整示例可在 plunkr 上找到.单击按钮后，我希望
{{field}}以某种方式更新。有没有办法做到这一点？
最佳答案
您不应该这样做(除非它用于 测试 ，但即便如此，请考虑 protractor )。以这种方式与 Angular 交互是个坏主意。但如果你必须这样做，这就是你的做法。
function changeValue() {
var e = document.getElementById("field");
e.value = "updated value";
var $e = angular.element(e);
$e.triggerHandler('input');
}
PLNKR
一种不同的中间方式是
function changeValue() {
var e = document.getElementById("field");
var scope = angular.element(e).scope();
scope.field = "updated value";
scope.$digest();
}
PLNKR
正确的方法是使用 Angular Controller
$scope.changeValue = function(){
$scope.field = "updated value";
};
PLNKR
关于AngularJS 手动更新输入不会触发模型的变化，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/22942509/