它检查后前pression ___已经改变 [英] Expression ___ has changed after it was checked

问题描述

为什么在这个简单的普拉克

@Component({
  selector: 'my-app',
  template: `<div>I'm {{message}} </div>`,
})
export class App {
  message:string = 'loading :(';

  ngAfterViewInit() {
    this.updateMessage();
  }

  updateMessage(){
    this.message = 'all done loading :)'
  }
}

投掷：

例外：EX pression我{{消息}}在应用@ 0：5有人检查后发生了变化。 previous值：'我加载:(当前值：'我都加载完成:)在[我{{消息}}在应用@ 0：5]

EXCEPTION: Expression 'I'm {{message}} in App@0:5' has changed after it was checked. Previous value: 'I'm loading :( '. Current value: 'I'm all done loading :) ' in [I'm {{message}} in App@0:5]

在所有我做的是更新一个简单的绑定时，我的看法是开始？

when all I'm doing is updating a simple binding when my view is initiated?

推荐答案

如上所述通过drewmoore，在这种情况下，适当的解决方案是手动触发改变检测为电流分量。这是通过使用 ChangeDetectorRef 对象的 detectChanges（）方法（从 angular2 /进口完成核心）。有关例如：

As stated by drewmoore, the proper solution in this case is to manually trigger change detection for the current component. This is done using the detectChanges() method of the ChangeDetectorRef object (imported from angular2/core). Relevant example:

import { Component, ChangeDetectorRef } from 'angular2/core'

@Component({
  selector: 'my-app',
  template: `<div>I'm {{message}} </div>`,
})
export class App {
  message: string = 'loading :(';

  constructor(cdr: ChangeDetectorRef) {
    this.cdr = cdr;
  }

  ngAfterViewInit() {
    this.message = 'all done loading :)'
    this.cdr.detectChanges();
  }

}

下面也Plunkers展示 ngOnInit ，的的setTimeout 和 enableProdMode 方法，以防万一。

Here are also Plunkers demonstrating the ngOnInit, setTimeout, and enableProdMode approaches just in case.

这篇关于它检查后前pression ___已经改变的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！