读取Angular中

Question

也许有人可以帮助我。我在一个对象中有一个数组。我只能从对象中获得Array(Articles)。那不是我的问题。我的问题是我现在在Angular中使用*ngFor来阅读文章列表，但没有id。生成IDs。

如何让Angular从中读取？

我可以通过放置文章[0]或文章1来阅读数组，但我需要获取所有文章并单独指定不会起作用。任何帮助都会很棒！多谢你们。

TS页

blog: string[];
blogs: string[] = [];

ngOnInit() {
        this.getNewsData().subscribe((blog) => {
            this.blogs.push(blog);
            console.log(blog.articles);
        });

component.html文件

<mat-card class="example-card" *ngFor="let blog of blogs.articles">
        <mat-card-header>
          <div mat-card-avatar class="example-header-image"></div>
          <mat-card-title>{{ blog.title }}</mat-card-title>
          <mat-card-subtitle>{{ blog.author }}</mat-card-subtitle>
        </mat-card-header>
        <img mat-card-image src="{{ blog.urlToImage }}" alt="Photo of a Shiba Inu">
        <mat-card-content>
          <p>
            {{ blog.titles }}
          </p>
        </mat-card-content>
        <mat-card-actions>
          <button mat-button>LIKE</button>
          <button mat-button>SHARE</button>
        </mat-card-actions>
</mat-card>

Answer 1

问题是你正在将你从getNewsData()获得的对象推送到一个数组中，但这并没有多大意义，因为你只关心这个对象。

将您的代码更改为：

blogs;

ngOnInit() {
  this.getNewsData().subscribe((blogs) => {
    this.blogs = blogs;
});

Answer 2

不确定为什么需要id来循环使用* ngFor。它应该遍历数组中的每篇文章并发送它。如果要为数组中的每个属性赋予一个id，请使用与index连接的字符串生成一个。