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

时间:2019-03-18 10:22:36

标签: angular angular-template ng2-smart-table

我正在使用ng Smarttable并通过事件更改数据源数组(更改是数组内部值的id更改)。问题是,角度不会检测到更改,直到我将鼠标悬停在页面上或单击某处之前,什么都不会发生。

因此,这些更改将正确地应用在幕后,并且一旦我单击某个位置,角度就会“看到”这些更改。

所以我可以手动单击很多次以查看chaning属性,但这不是必需的。

我尝试过:

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

有可能有这样的东西吗?

this.renderer.refresh();

还是仅使用ng smartable的功能?

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

我没有遵守诺言。将普通的DetectChange()放入承诺中即可

1 个答案:

答案 0 :(得分:3)

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

将ApplicationRef注入您的组件。

constructor(appRef: ApplicationRef) {}

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

appRef.tick();