З документів:
detectChanges (): недійсний
Перевіряє детектор змін та його дітей.
Це означає, що якщо є випадок, коли будь-яка річ всередині вашої моделі (вашого класу) змінилася, але вона не відобразила вигляд, можливо, вам доведеться сповістити Angular, щоб виявити ці зміни (виявити локальні зміни) та оновити вигляд.
Можливими сценаріями можуть бути:
1- Детектор змін відірваний від подання (див. Розділ )
2- Оновлення трапилось, але воно не було у кутовій зоні, тому Angular не знає про це.
Як і коли функція сторонніх розробників оновила вашу модель, і ви хочете оновити подання після цього.
someFunctionThatIsRunByAThirdPartyCode(){
yourModel.text = "new text";
}
Оскільки цей код знаходиться за межами зони Angular (ймовірно), вам, швидше за все, потрібно обов’язково виявити зміни та оновити вигляд, таким чином:
myFunction(){
someFunctionThatIsRunByAThirdPartyCode();
// Let's detect the changes that above function made to the model which Angular is not aware of.
this.cd.detectChanges();
}
ПРИМІТКА :
Існують інші способи зробити вищезазначені роботи, іншими словами, є інші способи залучити цю зміну до циклу кутових змін.
** Ви можете зафіксувати цю функцію сторонніх сторін усередині zone.run:
myFunction(){
this.zone.run(this.someFunctionThatIsRunByAThirdPartyCode);
}
** Ви можете обернути функцію всередині setTimeout:
myFunction(){
setTimeout(this.someFunctionThatIsRunByAThirdPartyCode,0);
}
3- Також є випадки, коли ви оновлюєте модель після change detection cycleзавершення, коли в цих випадках ви отримуєте цю жахливу помилку:
"Вираз змінився після його перевірки";
Це загалом означає (з мови Angular2):
Я побачив зміни у вашій моделі, які були спричинені одним із моїх прийнятих способів (події, запити XHR, setTimeout та ...), а потім я запустив своє виявлення змін, щоб оновити ваше уявлення, і я закінчив його, але потім був інший функція у вашому коді, яка знову оновила модель, і я не хочу знову запускати детектування змін, оскільки немає брудної перевірки, як AngularJS: D, і ми повинні використовувати один спосіб передачі даних!
Ви обов'язково натрапите на цю помилку: P.
Кілька способів виправити це:
1- Правильний спосіб : переконайтеся, що оновлення знаходиться в межах циклу виявлення змін (оновлення Angular2 - це один із способів, що трапляються один раз; не оновлюйте модель після цього і не переміщуйте код у кращу сторону / час).
2- Ледачий спосіб : запустіть detectChanges () після цього оновлення, щоб зробити angular2 щасливим, це, безумовно, не найкращий спосіб, але, як ви запитали, які можливі сценарії, це один з них.
Таким чином, ви говорите: я щиро знаю, що ви запустили детектування змін, але хочу, щоб ви це зробили ще раз, тому що мені довелося щось оновлювати, коли ви закінчили перевірку.
3- Помістіть код усередині a setTimeout, оскільки setTimeoutвін виправлений за зоною і буде запущений detectChangesпісля його закінчення.
Від док
markForCheck() : void
Позначає всіх предків ChangeDetectionStrategy як перевірених.
Це в основному потрібно, коли ChangeDetectionStrategy вашого компонента є OnPush .
Сам OnPush означає, що запускайте виявлення змін лише в тому випадку, якщо щось із цього сталося:
1- Один з компонентів @inputs був повністю замінений на нове значення або, просто кажучи, якщо посилання на властивість @ Input повністю змінилася.
Отже, якщо ChangeDetectionStrategy вашого компонента є OnPush, і тоді у вас є:
var obj = {
name:'Milad'
};
А потім ви оновите / вимкніть його так:
obj.name = "a new name";
Це не оновить посилання на obj , отже, виявлення змін не запуститься, тому представлення не відображає оновлення / мутацію.
У цьому випадку вам доведеться вручну сказати Angular, щоб перевірити та оновити вигляд (позначитиForCheck);
Тож якщо ви зробили це:
obj.name = "a new name";
Вам потрібно зробити це:
this.cd.markForCheck();
Швидше, нижче це призведе до запуску виявлення змін:
obj = {
name:"a new name"
};
Що повністю замінило попередній obj на новий {};
2- Подія запустилася, як-от клацання чи якась така річ, або будь-який з дочірніх компонентів випустив подію.
Такі події, як:
- Клацніть
- Клавіатура
- Події підписки
- тощо.
Отже коротко:
Використовуйте, detectChanges()коли ви оновлювали модель після запуску кутової, вона виявляє зміни або якщо оновлення взагалі не було у світі кутів.
Використовуйте, markForCheck()якщо ви використовуєте OnPush, і ви обминаєте його ChangeDetectionStrategyшляхом мутації деяких даних або ви оновили модель всередині setTimeout ;