尝试区分“[object Object]”时出错。只允许数组和可迭代对象,但我没有发现我的代码有任何问题

Error trying to diff '[object Object]'. Only arrays and iterables are allowed but i dont see anything wrong with my code

过去一周我一直遇到这个问题,我到处搜索但找不到问题。

我的服务

private texst!: Posts[];

  
  public getPosts(): Observable<Posts[]>
  { 

    return this.http.get<Posts[]>("http://localhost/projects/php_rest_api/api/post/read.php").pipe(map((data) => {
      return this.texst = data;
    }));
  }

我的组件,我在这里添加服务和运行从我的数据库中获取数据的函数

public test: Posts[] = [];]

  constructor(public postService: PostsService,
              private http: HttpClient) {}

  ngOnInit(): void {
    this.getPosts();
  }

  public getPosts()
  {
    this.postService.getPosts().subscribe((response) => {
      this.test = response;
      console.log(this.test);
    })
  }

我的html

<div>
    <button (click)="getPosts()"></button>
    <div *ngFor="let test of test">
        {{test.title}}
    </div>
</div>

更改此设置,将您的变量 test 重命名为 testItem,因为它已被使用:

<div>
    <button (click)="getPosts()"></button>
    <div *ngFor="let testItem of test">
        {{testItem.title}}
    </div>
</div>

这意味着您正在尝试遍历对象,但您认为它是一个数组。

如果该图像是 response 的日志,您最好这样做:

public getPosts()
  {
    this.postService.getPosts().subscribe((response) => {
      this.test = response.data; // <.. this changes!
    })
  }

并在模板中:

<div *ngFor="let testItem of test">
      {{testItem.title}}
</div>

设法修复它

在我的 getPosts() 函数中更改了对 object.values 的响应

 public getPosts()
  {
    this.postService.getPosts().subscribe((response) => {
      this.test = Object.values(response);
      console.log(this.test);
    })
  }