Angular 2 и Ionic 2: Каковы различия между конструкторами, методами ionViewDidLoad и ngOnInit

Ответ 1

Хотя ответ niks указывает на правильный порядок запуска событий жизненного цикла, команда Angular рекомендует против сбора данных внутри конструкторов.

Но чтобы ответить на ваш вопрос, ionViewDidLoad() и ngOnInit() должны запускаться в одно и то же время, поэтому они по сути являются одними и теми же; хотя ionViewDidLoad() проверяет кеширование:

Если страница выходит, но кэшируется, это событие больше не запускается последующий просмотр.

При этом для чего-либо, чего вы не хотите кэшировать, но хотите загрузить/до того, как компонент будет установлен, вы должны использовать ionViewWillEnter() или ionViewWillLoad() для таких вещей, как GET-запросы. ionViewWillLoad() еще не документирован.

Ответ 2

В отношении ionic2 constructor: в простых терминах мы используем его для создания экземпляра наших плагинов, сервисов и т.д., например: у вас есть страница (вид), где вы хотите показать список всех учеников, и у вас есть json файл, содержащий всех студентов (этот файл является вашим файлом данных), что вам нужно сделать, это создать службу в этой службе, вы создадите метод и получите запрос http.get, чтобы получить json-данные, поэтому здесь вам нужно что? http просто так:

import {Http} from '@angular/http';
@Injectable()
export class StudentService{
    constructor(public http: Http){}
    getAllStudents(): Observable<Students[]>{
        return this.http.get('assets/students.json')
        .map(res => res.json().data)     
        }
    }

снова обратите внимание на конструктор, если мы хотим использовать этот метод сервиса, мы перейдем к нашему представлению/странице и:

import {StudentService} from './student.service';
import { SocialSharing } from '@ionic-native/social-sharing';
export class HomePage implements OnInit {

  constructor(public _studentService: StudentService, public socialSharing: SocialSharing) {
   }

снова обратите внимание на конструктор здесь, мы создаем экземпляр StudentService в конструкторе и еще одну вещь, мы используем плагин socialSharing, чтобы использовать то, что мы создаем экземпляр этого в конструкторе.

OnInit: это действительно удивительная вещь в ionic2, или мы можем сказать в AngularJs2. В том же выше примере мы можем видеть, что такое ngOnInit. Таким образом, вы готовы с помощью метода обслуживания, теперь, когда на вашем представлении/странице вы хотите, чтобы данные списка учащихся были доступны, как только появится ваше представление, это должна быть первая операция, выполняемая автоматически при загрузке, потому что, поскольку просмотр загружает ученика список должен быть видимым. Таким образом, класс реализует OnInit, и вы определяете ngOnInit. Пример:

export class HomePage implements OnInit {
...
....
constructor(....){}

ngOnInit(){
    this._studentService.getAllStudents().subscribe(
     (students: Students[]) => this.students = students, 
    )

Надеюсь, это объяснение устранит ваши сомнения в отношении этих двух. Благодаря

Ответ 3

Конструктор

A constructor не является функцией Angular, он вызывается механизмом Javascript. Ну, написанный в TypeScript, но это концепция ES6, она является частью цикла жизненного цикла класса. Поэтому неплохо узнать, когда Angular завершил инициализацию своих компонентов.

Это подходящее место для любой инъекции зависимостей.

ngOnInit

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

Это хорошее место для инициализации некоторых данных для компонента.

ionViewDidLoad

ionViewDidLoad - событие жизненного цикла ионической навигации. Ionic имеет концепцию страниц. Он имеет некоторые классы, связанные с логикой навигации, базовый класс для него - NavController. Они имеют концепцию навигационного стека, поэтому страницы в основном выталкиваются или выталкиваются из стека. Во время этого процесса события жизненного цикла навигации, такие как ionViewDidLoad, запускаются.

ionViewDidLoad вызывается после загрузки страницы. Страницы кэшируются по умолчанию, это означает, что это событие не будет возобновлено, если не будет уничтожено.

Учитывая, что это хорошее место для установки кода для страницы.

Литература:

Ionic NavControler

Angular Ключи жизненного цикла

ES6 Классы