构造函数中的变量初始化速度不够快,无法防止htmlcode[Angular]中出现空指针异常

any . 但这不会及时发生,因为在代码的前端:

<h2>{{(formGroup) ? formGroup.get('title').value : bookLinkArticle.title}}</h2>

导致空指针异常。

下面是后端代码:

import { Component, OnInit, Input } from '@angular/core';
import { GenericArticleDTO } from '../dto/generic-article-dto';
import { FormGroup } from '@angular/forms';

@Component({
  selector: 'app-book-article',
  templateUrl: './book-article.component.html',
  styleUrls: ['./book-article.component.css']
})
export class BookArticleComponent implements OnInit {
  @Input() data: any;
  bookLinkArticle: GenericArticleDTO;
  formGroup: FormGroup;

  //als het als voorbeeld gebruikt wordt moet de formGroup geinjecteerd worden, anders een bookLinkArticle.
  constructor() {
    if(this.data instanceof FormGroup){
      this.formGroup = this.data as FormGroup;
      console.log("is formgrpu undefined:" + this.formGroup === undefined);
    }
    else if(this.data instanceof GenericArticleDTO)
      this.bookLinkArticle = this.data as GenericArticleDTO;
   }

  ngOnInit() {
  }

}

我一直认为,在对象或组件创建过程中,构造函数首先被调用。根据文章 Essential difference between constructor and ngoninit 与组件初始化过程相关的差异 ).

但HTML模板似乎是在调用构造函数之前构造的,否则我将不会得到空指针异常。解决方案是将代码从构造函数移到ngonit。但这对我来说毫无意义,ngOnInit是一个特殊的方法,但仍然是一个方法,直到构造函数完成构造/初始化之后才会调用方法。因为将代码移动到ngOnInit解决了这个问题,所以似乎ngOnInit是在构造函数被调用之前调用的!