Question

我有一些ng-model输入元素可以获得更新的非angularJS函数，比如jquery或者有时候是纯javascript DOM apis。 html输入元素上的值会更改，但模型范围变量不会更新。有没有办法强制角度来处理这些更新

app.js
超过5秒后，值1将更改为999.这反映在html中，但不会反映在$ scope.val

中

 angular.module('inputExample', [])
   .controller('ExampleController', ['$scope', '$timeout',function($scope,$timeout) {
     $scope.val = '1';
     $timeout(function(){
       document.getElementById("myid").value = 999;

     },5000)
   }]);

HTML

<form name="testForm" ng-controller="ExampleController">
  <input id="myid" ng-model="val" ng-pattern="/^\d+$/" name="anim" class="my-input"
         aria-describedby="inputDescription" />
         <div>
           {{val}}
         </div>
</form>

我还将代码保存在plunker中 http://plnkr.co/edit/4OSW2ENIHJPUph9NANVI?p=preview

Answer 1

如果没有在输入中进行某种更改而触发更新到999，则需要执行此操作：

onFocusChange()

你不需要在angular中使用像document.getElement（s）....这样的东西。只需在angular.module('inputExample', []) .controller('ExampleController', ['$scope', '$timeout',function($scope,$timeout) { $scope.val = '1'; $timeout(function(){ $scope.val = 999; },5000) }]);

上设置新值即可

以下是更正的Plunker：http://plnkr.co/edit/fWxMeNcJFtQreMKZaB5H?p=preview

Answer 2

更新$scope而不是DOM元素。

$scope.val = 999;

Answer 3

您可以手动设置将强制更新的表单元素的viewValue。

public class Show
{
    public string Name { get; set; }
    public List<Episode> Episodes { get; set; }
}

public class Episode
{
    public string Name { get; set; }
    public Nullable<bool> Seen { get; set; }
}

请参阅更新后的R-help mailing list。

Answer 4

您可以通过

实现这一目标

$timeout(function(){
       document.getElementById("myid").value = 999;
       angular.element(document.getElementById("myid")).triggerHandler('change');
     },5000)

然而，更好的方法是直接更新范围，

 $timeout(function(){
           angular.element(document.getElementById("myid")).scope().val = 999;
         },5000)

更新角度ng模型中的HTML输入值更改

4 个答案: