Какова цель реализации класса OnInit, удаление ngOnInit работает нормально?

Question

В Angular 6, когда мы создаем компонент, файл .ts этого компонента имеет класс, который реализует класс OnInit, но когда мы удаляем метод по умолчанию (ngOnInit), он работает нормально.поэтому мой вопрос: если он реализует какой-то класс, то у него должен быть какой-то метод, который должен был быть реализован в этом реализованном классе, если для этого нет необходимости иметь методы, тогда какова цель реализации класса OnInit.

Answer 1

OnInit - это не класс, а интерфейс, предоставляемый платформой, поэтому, если вы хотите что-то делать при инициализации компонента, вы можете предоставить метод ngOnInit () в своем классе и иметь свой код там.Подробнее о ngOnInt: https://angular.io/api/core/OnInit

Если вы реализовали интерфейс OnInit, но не предоставили ngOnInit, вы получите ошибку компиляции в своем коде, создаваемом VSCode или другим редактором.

Примерно так:

Класс 'ClaimComponent' неправильно реализует интерфейс 'OnInit'.Свойство 'ngOnInit' отсутствует в типе 'GiftingClaimComponent'.

Однако оно будет работать нормально, так как в конечном итоге код TS компилируется в JavaScript.

А поскольку JavaScript не имеет такой безопасности типов или взаимосвязи интерфейсов, которые мы получаем в TypeScript.Однако, если вы попытаетесь создать сборку AOT для вашего приложения, это не удастся, и вам придется предоставить реализацию.

Answer 2

Как сказал @Patricio Vargas, если вы экспортируете свой компонент класса, который реализует интерфейс OnInit, вам нужно будет реализовать метод ngOnInit(), в противном случае вы получите ошибку TS2420 (вы можете попробовать, конечно, on stackblitz путем простой реализации интерфейса OnInit внутри стандартного AppComponent, предусмотренного для проектов Angular.

Что касается второго пункта, цели реализации этого интерфейса, вы должны иметь в виду 2-й этап:Угловая начальная загрузка:

1. Построение дерева компонентов
2. Обнаружение изменений

Рекомендуется (иногда необходимо) инициализировать компонент с помощью хука OnInitа не внутри конструктора (который вместо этого должен использоваться для DI), главным образом потому, что вызов конструктора является частью «построения дерева угловых компонентов», и тогда входные привязки не будут доступны внутри конструктора (так как они являются частью фаза изменения обнаружения .

Answer 3

ngOnInit - это хук жизненного цикла, вызываемый Angular для указания того, что Angular завершил создание компонента.

Мы импортируем OnInit, чтобы использовать его, реализация OnInit не обязательна, но считаетсяхорошая практика):

import {Component, OnInit} from '@angular/core';

Мы используем ngOnInit, чтобы что-то делать после создания компонента.например, вы можете установить переменные здесь, вызывать методы и т. д.

https://angular.io/api/core/OnInit

Если вы импортируете OnInit и делаете export class AppComponent implements OnInit, то вам нужно добавить метод ngOnInit(), иначе выбудет иметь ошибку компиляции