无法访问$ watch内的范围变量

时间:2016-12-07 06:28:26

标签: javascript html css angularjs

我正在 angularJS 中开发一个过滤器。一切都工作正常,但只在一个地方我无法访问范围对象,但当我更改代码它工作正常但我想知道是什么问题。我认为我的理解是错误的范围和指令。

在一个指令中我正在访问一个数组并在scope.watch函数中我尝试访问该数组但它无法正常工作

工作代码

var currentScope=scope.mainList[scope.$index].list;
//this will hit whenever any of the scope variable changes
scope.$watch(function () {
  var hasTrue, hasFalse;
  angular.forEach(currentScope, function (v) {
    if (v["isSelected"]) {
      hasTrue = true;
    } else {
      hasFalse = true;
    }
  });
  if (hasTrue && hasFalse) {
    iElement.attr('checked', false);
   // iElement.addClass('greyed');
  } else {
    iElement.attr('checked', hasTrue);
   // iElement.removeClass('greyed');
  }
}, true);

这不起作用

var currentScope=scope.mainList[scope.$index].list;
 //this will hit only when this corresponding scope variable changes
scope.$watch(currentScope,function (newVal) {
  var hasTrue, hasFalse;
  angular.forEach(newVal, function (v) {
    if (v["isSelected"]) {
      hasTrue = true;
    } else {
      hasFalse = true;
    }
  });
  if (hasTrue && hasFalse) {
    iElement.attr('checked', false);
   // iElement.addClass('greyed');
  } else {
    iElement.attr('checked', hasTrue);
   // iElement.removeClass('greyed');
  }
}, true);

我需要第二个代码,但每当我更改任何变量时,它都没有命中并且未定义

请检查这个波纹管链接,它会给出更多的想法.....

Code

1 个答案:

答案 0 :(得分:1)

扩展@ tobi的评论,以下是编写监视功能的推荐方法:

var currentScope=scope.mainList[scope.$index].list;
scope.$watch(function () { return currentScope; }, function (newVal) {
  var hasTrue = false, hasFalse = false;
  angular.forEach(newVal, function (v) {
    if (v["isSelected"]) {
      hasTrue = true;
    } else {
      hasFalse = true;
    }
  });
  if (hasTrue && hasFalse) {
    iElement.attr('checked', false);
   // iElement.addClass('greyed');
  } else {
    iElement.attr('checked', hasTrue);
   // iElement.removeClass('greyed');
  }
});

或者,你可以这样做:

scope.currentScope=scope.mainList[scope.$index].list;
scope.$watch('currentScope', function (newVal) {
  var hasTrue = false, hasFalse = false;
  angular.forEach(newVal, function (v) {
    if (v["isSelected"]) {
      hasTrue = true;
    } else {
      hasFalse = true;
    }
  });
  if (hasTrue && hasFalse) {
    iElement.attr('checked', false);
   // iElement.addClass('greyed');
  } else {
    iElement.attr('checked', hasTrue);
   // iElement.removeClass('greyed');
  }
});