Angular 调用API时来自observable的响应数据在控制台中显示数据，但在模板10中不呈现

我正在尝试将响应从API加载到视图中。这是一项非常简单的任务，但是遇到了一个非常糟糕的问题

myItems: any[] = [];

constructor(private http: HttpClient) {}

ngOnInit() {
this.http
  .get("https://jsonplaceholder.typicode.com/posts")
  .subscribe((res: any[]) => {
    this.myItems = res;
    console.log("in call api : ", this.myItems);
  });
 }

我从API获取项目并将结果存储在数组中，然后在模板中打印所有数组

<ul>
 <li *ngFor="let i of myItems">
  {{ i.id }}
 </li>
</ul>

{{i.id}

---

问题是数据有时会显示在视图中，有时则不会。在TS文件中，它总是在控制台中显示结果。另外，如果列表第一次没有出现，那么只要我再次单击页面链接，列表就会出现在模板上。即使单击导航中的某个下拉列表，该列表也会显示在视图上。我的应用程序使用Metronic主题。这只是一个简单的任务，我已经在一个基本的angular应用程序上试过了，效果非常好。我不知道这里发生了什么。我非常感谢你的帮助。谢谢。

尝试将您的http调用放入

ngOnInit（）{}

并使您的组件实现

onInit

除非真的没有其他方法，否则不要使用构造函数。使用Angulars生命周期挂钩代替

---

控制台输出显示了什么？是json吗？Console输出项目数组，但当我尝试呈现此数组模板时，什么都没有发生。请发布代码而不是图像。我想知道您是否可以尝试在模板中不使用| json，看看会发生什么，或者看看是否在OnInit而不是构造函数中得到不同的结果。问题可能已经解决。我通过改变ChangeDetectionStrategy做到了这一点。它被设置为onPush。我将此更改为默认设置，并再次默认启动更改检测。我已更新问题，请再次查看我的问题。非常感谢。