PLNKR

Question

当我从普通JavaScript更改输入元素的值时，角度模型不会更新。是否有任何方法通过在更改后手动触发某些事件来以某种方式触发此更新？

<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}}。有没有办法做到这一点？

Answer 1

你不应该这样做（除非测试，但即便如此，请考虑protractor）。以这种方式与角度交互是一个坏主意。但是，如果你必须，请按照以下方式进行操作。

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

正确的方法是使用角度控制器

  $scope.changeValue = function(){
    $scope.field = "updated value";
  };

手动AngularJS更新输入不会触发模型中的更改

1 个答案:

PLNKR

PLNKR

PLNKR