在Angular中的父组件和子组件之间检查表达式后,表达式已更改

时间:2019-03-26 13:39:06

标签: angular typescript

我有一个父组件,它调用子加载微调器组件。

我正在使用属性来传递消息。

在父组件中

<app-loading-spinner textBloc="LOADING_DATA_IN_PROGRESS"></app-loading-spinner>

在子组件中

export class LoadingSpinnerComponent implements OnInit {

  @Input() textBloc: string;

  constructor(
    public activeModal: NgbActiveModal,
  ) { }

  ngOnInit() { }
}

在子组件的HTML中

<div class="text-center">
  <label>
    <p [innerHTML]='textBloc | translate'></p>
  </label>
</div>

我正在使用翻译模块来渲染json文件中的文本

"LOADING_DATA_IN_PROGRESS": "Chargement des données en cours, veuillez patienter...",

加载页面时出现此错误

ERROR Error: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: 'innerHTML: undefined'. Current value: 'innerHTML: Chargement des données en cours, veuillez patienter...'. It seems like the view has been created after its parent and its children have been dirty checked. Has it been created in a change detection hook ?

我已经读过很多有关此错误的文章,但是当textBloc未定义时无法理解。

我试图在构造函数中初始化textBloc

constructor(
  public activeModal: NgbActiveModal,
) { 
  this.textBloc='';
}

0 个答案:

没有答案