Question

我有一个针对ui-select2下拉模型的手表设置（来自ui-bootstrap）。手表会在负载时触发但不会在数据更改时触发，我无法弄清楚原因。

这不是通常的问题，即不应用模型更改或不使用第三个参数进行相等比较（至少从我的代码中）。

我需要做些什么来解雇它？

Here is a plunk demonstrating the issue.

Answer 1

尝试将true作为第3个参数传递给.$watch()

$rootScope.Scope documentation

$watch(watchExpression, listener, objectEquality)

objectEquality（可选） - {boolean =} - 比较对象是否相等而不是参考。

Answer 2

我修了一些东西。

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对象作为模型是不好的做法，而范围应该引用作为模型的对象。

Answer 3

有一个简单的解决方法，使用带有复杂对象的手表而不是简单的变量

例如（DON＆＃34; T USE）

$scope.selectedType=1;//default
$scope.$watch(
            function () {
                return $scope.selectedType;
            },
            function (newValue, oldValue) {
                if (!angular.equals(oldValue, newValue)) {
                    $scope.DoWork();
                }
            },
            true);

但请使用以下

$scope.selecteditem={selectedType:1};
$scope.$watch(
            function () {
                return $scope.selecteditem.selectedType;
            },
            function (newValue, oldValue) {
                if (!angular.equals(oldValue, newValue)) {
                    $scope.DoWork();
                }
            },
            true);

请注意＆＃34; slectedTypes＆＃34;在位于对象内的第二个示例中，而不仅仅是范围变量。这甚至可以在旧的Angular版本中使用。

Answer 4

如果你正在使用控制器作为方法，一些阅读可能会建议这样的语法：

var myController = {
    myValue: 1
};
$scope.$watch('$ctrl.myValue', function () {
    ...
}, true);

而是将字段包装在这样的函数中：

var myController = {
    myValue: 1
};
$scope.$watch(function () {
    return myController.myValue;
}, function () {
    ...
}, true);

Answer 5

唯一对我有用的东西：

  var ctrl = this;

  this.$onInit = function () {
    console.log("id " + ctrl.event.id);
  };

来自https://docs.angularjs.org/guide/component#！

$ watch不会触发数据更改

5 个答案: