От автора: в каждом приложении Angular циклы работают с задействованием полного набора процессов.
На следующей диаграмме показаны все процессы цикла приложения Angular 2.
Ниже приводится описание каждого этапа цикла приложения Angular.
ngOnChanges — когда изменяются значение свойств, связанных с данными, вызывается этот метод.
ngOnInit — вызывается каждый раз при инициализации директивы / компонента после первого отображение Angular свойств, связанных с данными.
ngDoCheck – используется для определения и обработки изменений, которые сам Angular определить не может.
ngAfterContentInit — вызывается после того, как Angular ввел внешний контент в представление компонента.
ngAfterContentChecked — вызывается после того, как Angular начинает проверять контент, вводимый в компонент.
ngAfterViewInit – вызывается после того, как Angular инициализировал представления компонента и дочерние представления.
ngAfterViewChecked — вызывается после того, как Angular инициализировал представления компонента и дочерние представления.
ngOnDestroy – это фаза очистки непосредственно перед тем, как Angular удаляет все директивы / компоненты.
Ниже приведен пример реализации хука цикла приложения. Добавьте следующий код в файле app.component.ts
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
import { Component } from '@angular/core'; @Component ({ selector: 'my-app', template: '<div> {{values}} </div> ' }) export class AppComponent { values = ''; ngOnInit() { this.values = "Hello"; } } |
В приведенной выше программе мы вызываем хук цикла приложения ngOnInit, чтобы явно указать, что для параметра this.values должно быть установлено значение «Hello». После сохранения всех изменений в коде и обновления страницы браузера вы получите следующий результат.
Источник: //www.tutorialspoint.com/
Редакция: Команда webformyself.