Angular 2 Конструктор компонентов Vs OnInit
Если я хочу, чтобы функция x выполнялась каждый раз, когда компонент загружается, независимо от того, в первый раз, я перехожу на другой сайт и перемещаюсь обратно или в пятый раз, когда компонент загрузился.
Что мне нужно положить в функцию x? Конструктор компонента или OnInit?
Ответы
Ответ 1
Конструктор - это предопределенный метод по умолчанию класса typescript. Между Angular и constructor
нет отношения. Обычно мы используем constructor
для определения/инициализации некоторых переменных, но когда у нас есть задачи, связанные с привязками Angular, мы переходим к Angular ngOnInit
hook. ngOnInit
вызывается сразу после вызова конструктора. Мы также можем выполнять ту же работу в конструкторе, но предпочтительно использовать ngOnInit
для начала привязки Angular.
чтобы использовать ngOnInit
, мы должны импортировать этот крюк из основной библиотеки:
import {Component, OnInit} from '@angular/core'
Затем мы реализуем этот интерфейс с экспортированным классом (это не обязательно для реализации этого интерфейса, но в целом мы это сделали).
Пример использования обоих:
export class App implements OnInit{
constructor(){
//called first time before the ngOnInit()
}
ngOnInit(){
//called after the constructor and called after the first ngOnChanges()
}
}
Подробнее см. также Разница между конструктором и ngOnInit
Ответ 2
Первый (конструктор) связан с экземпляром класса и не имеет ничего общего с Angular2. Я имею в виду, что конструктор может использоваться для любого класса. Вы можете добавить в него некоторую обработку инициализации для вновь созданного экземпляра.
Второй соответствует крюку жизненного цикла компонентов Angular2:
-
ngOnChanges
вызывается, когда значение привязки ввода или вывода изменяется
-
ngOnInit
вызывается после первого ngOnChanges
Итак, вы должны использовать ngOnInit
, если обработка инициализации вашей функции зависит от привязок компонента (например, параметров компонента, определенных с помощью @Input
), в противном случае конструктора будет достаточно...
Ответ 3
constructor()
является typescript функцией и вызывается для new SomeClass()
. Конструктор обеспечивает правильный порядок инициализации поля в иерархиях классов.
ngOnInit
- это метод жизненного цикла Angular2, который вызывается Angular, когда он выполнял построение компонента, и после того, как он оценил привязки и обновил входные данные в первый раз.
См. также Разница между конструктором и ngOnInit