Angular 2 - 呈现 innerHtml 后的事件

Question

我有一个 div 元素，其中 innerHtml 绑定(bind)到一个 string(html) 属性。

<div  [effectDirectiveTrigger]="mainContent != null"   
      [innerHtml]="mainContent"></div>

我正在尝试构建一个在带有 innerHtml 的 div 完全呈现后“触发一些效果”的指令。因此我有一个触发器属性。

@Input('effectDirectiveTrigger')
trigger:boolean = false;

ngOnChanges(){
    console.log('ngOnChanges');
    if (this.trigger){
        // fire some effects
        // seems to happen before the innerHtml has been rendered
    }
}

我的问题是即使触发了属性，innerHtml 还没有写入。 Angular 似乎需要一些时间。它只有在设置一个笨拙的超时以允许 Angular catch 时才有效。

有没有我可以绑定(bind)的事件？或者您有任何其他/更好的想法来实现我想要做的事情吗？ jQuery 有帮助吗？

Answer 1

innerHTML 会在每次 mainContent 更新时更新，并且会发生以下更改检测周期。没有事件。 mainContent 更新后，您可以自己发出事件。如果您自己使用 cdRef.detectChanges() 调用更改检测，那么现在它已呈现。