Wykrywanie zmian kątowych: dlaczego całe drzewo jest sprawdzane pod lokalnymi zmianami? - kątowa, kątowa 2-zmiana

Powiedzmy, że mam prosty zestaw tekstów:

textContent = [
{text: "good morning"},
{text: "lovely day"},
{text: "for debugging"},
]

Dla każdego renderuję prosty komponent, przekazując element tekstowy jako dane wejściowe:

<app-text *ngFor="let text of textContent" [text]="text"></app-text>

Komponent tekstowy renderuje tekst za pomocą ngModel:

<textarea [(ngModel)]="text.text"></textarea>

Loguję się również DoCheck:

ngDoCheck() {
console.log(this.text.text, " has been checked")
}

Kiedy w coś wejdę jeden textarea, wszystkie inne komponenty „Wykonano CheckCheck.

good morning   has been checked
lovely days    has been checked
for debuggings has been checked

Dzieje się tak nawet wtedy, gdy OnPush jest używany do wykrywania zmian.

Pytanie: Dlaczego zmiany danych jednego komponentu powodują sprawdzenie całego drzewa?

(To nie jest problem z garstką komponentów, ale z większym drzewem „upuszczam klatki”).

Rzeczywiście zauważyłem, że nawet komponenty na całkowicie oddzielnym drzewie zawartości mają także „doCheck”.

Czy istnieje sposób, aby temu zapobiec, czy też brakuje mi czegoś innego?

Odpowiedzi:

2 dla odpowiedzi № 1

W Angular każdy komponent ma swoją własną zmianędetektor. Powodem tego jest to, że pozwala nam kontrolować każdy komponent indywidualnie. Oznacza to, że możemy mieć pełną kontrolę nad wykrywaniem zmian dla każdego komponentu całej aplikacji.

Chociaż jest to świetna funkcja, kiedy typomyśl o aplikacji Angular jako o zestawie komponentów lub, co zwykle nazywa się drzewem komponentu, oznacza to, że wszystkie komponenty w drzewie będą miały tę samą funkcję. Własny osobisty mechanizm detektora zmian. Po złożeniu ich w całość całe drzewo wykonuje wykrywanie zmian.

Jeśli nie są ustawione żadne zaawansowane techniki lub konfiguracje, domyślnie Angular używa konserwatywnego podejścia i wyzwala wykrywanie zmian w całym drzewie, gdy tylko nastąpi zmiana.

Oczywiście istnieją pewne mechanizmy idostępne techniki pozwalające na nieco większą kontrolę nad tym i wykrywanie zmian występują tylko wtedy, gdy coś rzeczywiście się zmienia i dotyczy tylko określonego komponentu i podskładników.

Spójrz na to artykuł gdzie Pascal Precht wyjaśnia szczegółowo, jak działa wykrywanie zmian.

Istnieje kilka technik pozwalających uniknąć problemówdoświadczają na przykład wykrywania zmian onPush, jak wspomniałeś, ale także użycia niezmiennych obiektów i obserwowalnych. Jeśli chcesz uzyskać pełną kontrolę nad wykrywaniem zmian, możesz ustawić wszystkie komponenty tak, aby posiadały zasady onPush.

---

0 dla odpowiedzi nr 2

Moje pytanie opierało się na nieporozumieniu z mojej strony, więc pozwólcie mi wyjaśnić:

Gdy wywoływany jest hak cyklu życia DoCheck () komponentu, to nie oznacza, że ​​została wykryta zmiana. Oznacza to tylko, że Angular wykonuje wykrywanie zmian i daje ci możliwość przechwycenia, aby wykonać niestandardową logikę.

Ten artykuł Jeśli myślisz ngDoCheck oznacza, że ​​Twój komponent jest sprawdzany - przeczytaj ten artykuł ma więcej szczegółów.

---