Angular：如何在修改资产文件时刷新组件内的 div

Question

我有一个外部 JSON 文件存储在 Angular 应用程序的

assets

文件夹中。此配置用于根据 JSON 中提供的到期日期在组件中显示图像。我已经开发了通过从文件中获取数据来显示图像的逻辑。

问题：

在服务器中部署产品版本后，如果我更改 JSON 中的内容（在

assets

内），视图将自动不会刷新。因此，我创建了一个

setInterval

函数，每隔 N 秒调用一次 API。这有点完美这里出现的问题是在第一次加载时有时

setInterval

不会被触发，或者有时如果我更改JSON中的值，间隔函数不起作用。这个问题在 DEV 服务器中不会发生，因为当更改资产中的数据时，角度服务器会整体刷新。

我为间隔编写的代码：

time: NodeJS.Timer;

ngOnInit() { this.getPassDetails() }

ngOnDestroy() { this.time = null }

private getPassDetails() {
  this.time = setInterval(() => this._ymcaform.fetchPassDetails().subscribe(response => this.CONFIG = response), 1000);
}

这里有什么问题吗？当资产内部的 JSON 发生变化时，是否还有其他方法可以刷新 UI？

Answer 1

好吧，尝试在你的组件中做这一件事。在您的 component.ts 文件中添加 changeDetection。

像这样：

@Component({
  // other data
  changeDetection: ChangeDetectionStrategy.Default
}) 

看看这是如何工作的。这将检测输入更改并触发更改检测。