如何手动强制重新渲染 Angular2 中的组件?

Loa*_*ing 4 angular-template ng2-smart-table angular

我正在使用 ng Smarttable 并通过事件更改数据源数组(更改是数组内值的 id 更改)。问题是 angular 无法检测到更改,并且在我将鼠标悬停在页面上或单击某处之前没有任何反应。

因此,更改在幕后正确应用,并且一旦我单击某处,angular 就会“看到”这些更改。

所以我可以手动点击很多次来查看 chaning 属性,但这不是我们想要的。

我试过:

  1. 在我更改数组的函数中使用 ChangeDetectorRef (markAsChanged & DetectChange)
  2. 更改数组后手动创建单击事件
  3. 使用不变性(this.data= [...this.data];

有可能有这样的东西吗?

this.renderer.refresh();
Run Code Online (Sandbox Code Playgroud)

还是仅使用 ng smartable 的功能?

编辑:看起来问题出在我这边。当您“刷新”智能表时,您会得到一个承诺,该承诺仅在加载完成后执行。

我没有使用承诺。将正常的 DetectChange() 放在承诺中使其工作

Dul*_*oon 7

您可以使用应用程序引用手动重新渲染。

将 ApplicationRef 注入您的组件。

constructor(appRef: ApplicationRef) {}
Run Code Online (Sandbox Code Playgroud)

然后在您想重新渲染时调用 tick 方法

appRef.tick();
Run Code Online (Sandbox Code Playgroud)