一尘不染

$ watch不触发数据更改

angularjs

我有一个针对ui-select2下拉菜单的手表设置(来自ui-bootstrap)。手表会在加载时触发,但不会在数据更改时触发,我不知道为什么。

不应用模型更改或不使用第三个参数进行相等性比较(至少来自我的代码)不是一个常见的问题。

我需要怎么做才能使其点火?

这是一个说明问题的小问题。


阅读 294

收藏
2020-07-04

共1个答案

一尘不染

我修好了一些东西。

http://plnkr.co/edit/5Zaln7QT2gETVcGiMdoW?p=preview

JS

var myMod = angular.module("myApp",[]).controller("MainController",  function($scope){
  $scope.myModel = {selectedId:null};
}).controller("DetailController",function($scope){
  $scope.items = [1,2,3,4];

  $scope.watchHitCount = 0;
  $scope.$watch('myModel.selectedId', function(newVal, oldVal){
    console.log(newVal + " " + oldVal);
    $scope.watchHitCount++;
  },true);
});

index.html

  <body ng-app="myApp">
    <div ng-controller="MainController">
      <ng-include src="'detail.html'" ng-controller="DetailController"></ng-include>
    </div>
  </body>

detail.html

<pre>watch hit: {{watchHitCount}}</pre>
<pre>selected value: {{myModel.selectedId}}</pre>
<select ng-model="myModel.selectedId" ui-select2="">
  <option></option>
  <option ng-repeat="item in items" value="{{item}}">{{item}}</option>
</select>

它抱怨找不到控制器,所以我以通常的方式使用命名的ng-app和声明了控制器的模块进行设置。

我还添加了一个对象来保存模型中的值。 将$ scope对象用作模型是一种不好的做法,相反,您的作用域应引用作为模型的对象。

2020-07-04