다음을 사용하여 여러 객체의 이벤트를 구독하는 방법이 있습니까? $watch
예 :
$scope.$watch('item1, item2', function () { });
답변
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
});
답변
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
});
플런저 예제는 여기
여기에 문서
답변
$watch
첫 번째 매개 변수는 함수일 수도 있습니다.
$scope.$watch(function watchBothItems() {
return itemsCombinedValue();
}, function whenItemsChange() {
//stuff
});
결합 된 두 값이 단순하면 첫 번째 매개 변수는 일반적으로 각도 표현식입니다. 예를 들어 firstName과 lastName은 다음과 같습니다.
$scope.$watch('firstName + lastName', function() {
//stuff
});
답변
다음은 실제로 작동하는 원래 의사 코드와 매우 유사한 솔루션입니다.
$scope.$watch('[item1, item2] | json', function () { });
편집 : 좋아, 나는 이것이 더 낫다고 생각한다.
$scope.$watch('[item1, item2]', function () { }, true);
기본적으로 우리는 멍청한 것처럼 보이는 json 단계를 건너 뛰지 만 그것이 없으면 작동하지 않았습니다. 이 키는 종종 생략되는 3 번째 매개 변수로, 참조 평등과 반대로 객체 평등을 켭니다. 그런 다음 생성 된 배열 객체 간의 비교가 실제로 올바르게 작동합니다.
답변
$ watchGroup의 함수를 사용하여 범위 내 객체의 필드를 선택할 수 있습니다.
$scope.$watchGroup(
[function () { return _this.$scope.ViewModel.Monitor1Scale; },
function () { return _this.$scope.ViewModel.Monitor2Scale; }],
function (newVal, oldVal, scope)
{
if (newVal != oldVal) {
_this.updateMonitorScales();
}
});
답변
왜 그것을 단순히 포장하지 forEach
않습니까?
angular.forEach(['a', 'b', 'c'], function (key) {
scope.$watch(key, function (v) {
changed();
});
});
실제로 값 구성에 대해 걱정할 필요없이 결합 된 값에 대한 기능을 제공하는 것과 거의 동일한 오버 헤드 입니다.
답변
값을 결합하는 약간 더 안전한 솔루션은 다음을 $watch
함수 로 사용하는 것입니다.
function() { return angular.toJson([item1, item2]) }
또는
$scope.$watch(
function() {
return angular.toJson([item1, item2]);
},
function() {
// Stuff to do after either value changes
});