Czy istnieje sposób na subskrybowanie wydarzeń na wielu obiektach za pomocą $watch
Na przykład
$scope.$watch('item1, item2', function () { });
Czy istnieje sposób na subskrybowanie wydarzeń na wielu obiektach za pomocą $watch
Na przykład
$scope.$watch('item1, item2', function () { });
Począwszy od AngularJS 1.3 istnieje nowa metoda wywołana $watchGroup
do obserwowania zestawu wyrażeń.
$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
ioldValues
asundefined
, podczas indywidualnego oglądania właściwości działają jak zwykle.Począwszy od AngularJS 1.1.4 możesz używać
$watchCollection
:Przykład plunkera tutaj
Dokumentacja tutaj
źródło
$watchCollection
ma na celu przekazanie obiektu i obserwowanie zmian w dowolnych właściwościach obiektu, podczas gdy w$watchGroup
zamierzeniu ma być przekazany szereg indywidualnych właściwości do obserwowania zmian. Nieco inaczej, aby rozwiązać podobne, ale różne problemy. Uff!$watch
Pierwszy parametr może być również funkcją.Jeśli dwie połączone wartości są proste, pierwszy parametr jest normalnie wyrażeniem kątowym. Na przykład firstName i lastName:
źródło
fullName = firstName + " " + lastName
wymaga przekazania funkcji jako pierwszego argumentu (zamiast prostego wyrażenia, takiego jak'firstName, lastName'
). Angular jest tak potężny, ale jest kilka obszarów, w których może być niezwykle przyjazny dla programistów w sposób, który (nie wydaje się) narażać na szwank wydajności lub zasad projektowania.$scope.$watch('firstName + lastName', function() {...})
. Można też po prostu zrobić dwa zegarki:function nameChanged() {}; $scope.$watch('firstName', nameChanged); $scope.$watch('lastName', nameChanged);
. Do odpowiedzi dodałem prosty przypadek.Oto rozwiązanie bardzo podobne do oryginalnego pseudokodu, które faktycznie działa:
EDYCJA: OK, myślę, że jest jeszcze lepiej:
Zasadniczo pomijamy krok Jsona, co na początku wydawało się głupie, ale bez niego nie działałoby. Klucz to często pomijany trzeci parametr, który włącza równość obiektów w przeciwieństwie do równości odniesienia. Wtedy porównania między naszymi utworzonymi obiektami tablicowymi faktycznie działają poprawnie.
źródło
TypeError: Object #<Object> has no method '$watchCollection'
ale to rozwiązanie pomaga mi rozwiązać mój problem!$scope.$watch('[chaptercontent.Id, anchorid]', function (newValues, oldValues) { ... }, true);
Możesz użyć funkcji w $ watchGroup, aby wybrać pola obiektu w zakresie.
źródło
_this
? Czy zakres nie jest przenoszony do funkcji bez wyraźnego zdefiniowania go?Dlaczego nie po prostu owinąć to w
forEach
?To mniej więcej tyle samo, co zapewnienie funkcji dla połączonej wartości, bez faktycznego martwienia się o skład wartości .
źródło
changed()
jest wywoływany za każdym razem, gdy coś zmienia się w którejkolwiek z właściwości. To jest dokładnie to samo zachowanie, jakby podano funkcję dla połączonej wartości.Nieco bezpieczniejszym rozwiązaniem łączenia wartości może być użycie następujących
$watch
funkcji:lub
źródło
Pierwszy parametr $ watch może być wyrażeniem kątowym lub funkcją. Zobacz dokumentację dotyczącą $ scope. $ Watch . Zawiera wiele użytecznych informacji o tym, jak działa metoda $ watch: kiedy wywoływana jest funkcja watchExpression, sposób porównywania wyników przez kąt itp.
źródło
Co powiesz na:
źródło
true
parametru toscope.$watch
(jak w twoim przykładzie)listener()
uruchamiany byłby za każdym razem, ponieważ anonimowy skrót ma za każdym razem inne odniesienie.return { a: functionA(), b: functionB(), ... }
. Następnie sprawdzam względem siebie zwrócone obiekty nowych i starych wartości.Tutaj funkcja zostanie wywołana, gdy zmieni się zarówno wiek, jak i imię.
źródło
Angular wprowadzony
$watchGroup
w wersji 1.3, za pomocą którego możemy oglądać wiele zmiennych, z jednym$watchGroup
blokiem$watchGroup
przyjmuje tablicę jako pierwszy parametr, w którym możemy uwzględnić wszystkie nasze zmienne do oglądania.źródło