2016-12-07 40 views
1

我正在开发一个筛选器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

+0

该变量在第二个代码访问? – Jigar7521

+0

@ Jigar7521:在第一个代码中,我们正在看整个范围,但在第二个只有特定的数组,但这第二个没有打,请检查我的小提琴你会明白的问题 – user3501613

+0

你是**没有**看整个范围在第一个例子。您正在观察提供的函数以更改其返回值。请阅读关于$ watch的信息:https://docs.angularjs.org/api/ng/type/$rootScope.Scope。它首先需要一个表达式(字符串或函数),第二个参数是侦听器(当它检测到表达式中的变化时由角度调用)。 您可能已经明白,您的代码是针对范围内的每个更改调用的,但angular会多次调用此函数来检测表达式中的更改。 – Tobi

回答

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'); 
    } 
}); 
+0

谢谢..我工作正常与我以前的代码的问题是每当任何范围内的任何变化将击中该手表功能,现在该问题解决.... – user3501613

+0

你可以解释为什么这一个范围$ watch(currentScope,function(newVal){}不起作用 – user3501613

+0

@user它不工作,因为你没有真正提供一个表达式给$ watch,你提供了一个已经评估过的结果,它永远不会改变。两个例子2ps给出了两种方法,我会这样做:提供一个字符串,其中包含一个可以在当前范围内进行评估的表达式(逻辑或只是上述对象的名称),或者提供一个函数,这将通过角度调用多次。一旦返回值从表达式或函数改变,角将调用你的监听器。 – Tobi