답변:
AngularJS 1.3부터는 $watchGroup
표현식 세트를 관찰하는 새로운 메소드가 있습니다.
$scope.foo = 'foo';
$scope.bar = 'bar';
$scope.$watchGroup(['foo', 'bar'], function(newValues, oldValues, scope) {
// newValues array contains the current values of the watch expressions
// with the indexes matching those of the watchExpression array
// i.e.
// newValues[0] -> $scope.foo
// and
// newValues[1] -> $scope.bar
});
$scope.$watchGroup(['mycustomctrl.foo', 'mycustomctrl.bar'],...
newValues
및 oldValues
as로 한 번만 실행되는 것을 볼 수 있습니다 undefined
.
AngularJS 1.1.4부터 다음을 사용할 수 있습니다 $watchCollection
.
$scope.$watchCollection('[item1, item2]', function(newValues, oldValues){
// do stuff here
// newValues and oldValues contain the new and respectively old value
// of the observed collection array
});
플런저 예제는 여기
여기에 문서
$watchCollection
객체를 전달하고 객체의 속성에 대한 변경 사항을 감시하는 반면, $watchGroup
변경 사항을 감시하기 위해 개별 속성 배열을 전달하는 것입니다. 비슷하지만 다른 문제를 해결하기 위해 약간 다릅니다. 휴!
$watch
첫 번째 매개 변수는 함수일 수도 있습니다.
$scope.$watch(function watchBothItems() {
return itemsCombinedValue();
}, function whenItemsChange() {
//stuff
});
결합 된 두 값이 단순하면 첫 번째 매개 변수는 일반적으로 각도 표현식입니다. 예를 들어 firstName과 lastName은 다음과 같습니다.
$scope.$watch('firstName + lastName', function() {
//stuff
});
fullName = firstName + " " + lastName
인수가 아닌 첫 번째 인수로 함수를 전달해야합니다 'firstName, lastName'
. Angular는 매우 강력하지만 성능이나 디자인 원칙을 훼손하지 않는 방식으로 개발자에게 더 친숙한 영역이 있습니다.
$scope.$watch('firstName + lastName', function() {...})
. 시계를 두 개만 사용할 수도 있습니다 function nameChanged() {}; $scope.$watch('firstName', nameChanged); $scope.$watch('lastName', nameChanged);
.. 간단한 사례를 답변에 추가했습니다.
다음은 실제로 작동하는 원래 의사 코드와 매우 유사한 솔루션입니다.
$scope.$watch('[item1, item2] | json', function () { });
편집 : 좋아, 나는 이것이 더 낫다고 생각한다.
$scope.$watch('[item1, item2]', function () { }, true);
기본적으로 우리는 멍청한 것처럼 보이는 json 단계를 건너 뛰지 만 그것이 없으면 작동하지 않았습니다. 이 키는 종종 생략되는 3 번째 매개 변수로, 참조 평등과 반대로 객체 평등을 켭니다. 그런 다음 생성 된 배열 객체 간의 비교가 실제로 올바르게 작동합니다.
TypeError: Object #<Object> has no method '$watchCollection'
했지만이 솔루션은 내 문제를 해결하는 데 도움이됩니다!
$scope.$watch('[chaptercontent.Id, anchorid]', function (newValues, oldValues) { ... }, true);
$ watchGroup의 함수를 사용하여 범위 내 객체의 필드를 선택할 수 있습니다.
$scope.$watchGroup(
[function () { return _this.$scope.ViewModel.Monitor1Scale; },
function () { return _this.$scope.ViewModel.Monitor2Scale; }],
function (newVal, oldVal, scope)
{
if (newVal != oldVal) {
_this.updateMonitorScales();
}
});
_this
합니까? 스코프가 명시 적으로 정의하지 않고 함수로 전달되지 않습니까?
왜 그것을 단순히 포장하지 forEach
않습니까?
angular.forEach(['a', 'b', 'c'], function (key) {
scope.$watch(key, function (v) {
changed();
});
});
실제로 값 구성에 대해 걱정할 필요없이 결합 된 값에 대한 기능을 제공하는 것과 거의 동일한 오버 헤드 입니다.
changed()
속성 중 하나에서 무언가가 변경 될 때마다 호출됩니다. 그것은 결합 된 값을위한 함수가 제공되는 것과 똑같은 동작입니다.
$ watch first 매개 변수는 각도 표현식 또는 함수일 수 있습니다 . $ scope. $ watch 설명서를 참조하십시오 . 여기에는 $ watch 메소드 작동 방식에 대한 유용한 정보가 많이 포함되어 있습니다. watchExpression이 호출 될 때, 각도가 결과를 비교하는 방법 등
어때요?
scope.$watch(function() {
return {
a: thing-one,
b: thing-two,
c: red-fish,
d: blue-fish
};
}, listener...);
true
to 에서 세 번째 매개 변수를 사용 하지 않으면 scope.$watch
(예와 같이) listener()
매번 실행됩니다.
return { a: functionA(), b: functionB(), ... }
. 그런 다음 새 값과 이전 값의 반환 된 객체를 서로 비교합니다.
$scope.$watch('age + name', function () {
//called when name or age changed
});
여기서 나이와 이름 값이 모두 변경되면 함수가 호출됩니다.
$watchGroup
버전 1.3에 도입 된 Angular는 여러 변수를 감시 할 수있는 단일 $watchGroup
블록을
사용하여 감시 할 $watchGroup
모든 변수를 포함 할 수있는 첫 번째 매개 변수로 배열을 사용합니다.
$scope.$watchGroup(['var1','var2'],function(newVals,oldVals){
console.log("new value of var1 = " newVals[0]);
console.log("new value of var2 = " newVals[1]);
console.log("old value of var1 = " oldVals[0]);
console.log("old value of var2 = " oldVals[1]);
});