Arrays html:53错误：尝试区分时出错'；[对象对象]'；。只允许使用数组和iterables

我有8个前端，node js是后端 我用sequelize包在一个函数中获取了多个表结果。 下面我提到了来自后端的结果JSON

{
"filtergroups": [
    {
        "id": 1,
        "name": "Ram",
        "subcatId": "1",
        "childcatId": 1,
        "createdAt": "2019-11-13T00:00:00.000Z",
        "updatedAt": "2019-11-13T00:00:00.000Z",
        "filters": [
            {
                "id": 1,
                "name": "2 GB",
                "filterGroupId": "1",
                "productId": "1",
                "createdAt": "2019-11-19T00:00:00.000Z",
                "updatedAt": "2019-11-27T00:00:00.000Z"
            }
        ]
    },
    {
        "id": 2,
        "name": "Internal Storage",
        "subcatId": "1",
        "childcatId": 1,
        "createdAt": "2019-11-05T00:00:00.000Z",
        "updatedAt": "2019-11-24T00:00:00.000Z",
        "filters": [
            {
                "id": 2,
                "name": "8 GB",
                "filterGroupId": "2",
                "productId": "1",
                "createdAt": "2019-11-20T00:00:00.000Z",
                "updatedAt": "2019-11-20T00:00:00.000Z"
            }
        ]
    }
],
"products": [
    {
        "id": 1,
        "name": "A7",
        "childcatId": "1",
        "subcatId": "1",
        "price": 18000,
        "mrp": 21000,
        "discription": "sfhshsfhsf",
        "image": "http://bestjquery.com/tutorial/product-grid/demo3/images/img-7.jpeg",
        "createdAt": "2019-11-13T00:00:00.000Z",
        "updatedAt": "2019-11-14T02:00:00.000Z"
    },
    {
        "id": 2,
        "name": "A8",
        "childcatId": "1",
        "subcatId": "1",
        "price": 22000,
        "mrp": 25000,
        "discription": "7578",
        "image": "http://bestjquery.com/tutorial/product-grid/demo3/images/img-8.jpeg",
        "createdAt": "2019-11-20T00:00:00.000Z",
        "updatedAt": "2019-11-21T00:00:00.000Z"
    },
    {
        "id": 3,
        "name": "Woodland",
        "childcatId": "2",
        "subcatId": "1",
        "price": 2500,
        "mrp": 2800,
        "discription": "7575",
        "image": "http://bestjquery.com/tutorial/product-grid/demo3/images/img-7.jpeg",
        "createdAt": "2019-11-20T00:00:00.000Z",
        "updatedAt": "2019-11-13T00:00:00.000Z"
    }
]

}

这个JSON我在显示部分得到一个错误，比如

CategoryComponent.html:53错误：尝试区分'[object]时出错 对象]”。只允许使用数组和iterables

服务台

getAllProduct(): Observable<Filter_group[]>{
let params_url = new HttpParams().set('fil_outlet',this.name);
console.log('new my ss--',this.name);
return this.http.get<Filter_group[]>("http://localhost:4500/mobile_store");

错误的

component.html

 <mat-accordion multi="true" *ngFor="let filter_group of filter_groups">
      <mat-expansion-panel>
        <mat-expansion-panel-header  >
          {{filter_group.name}}
        </mat-expansion-panel-header>
        <p >name</p>
      </mat-expansion-panel>
    </mat-accordion> <!-- filter-group  .// -->

 <div class="col-md-3 col-sm-6" *ngFor="let product of products">
          <div class="product-grid2">
            <div class="product-image2">
              <a routerLink="/categories">
                <img class="pic-1" src="{{product.image}}">
                <img class="pic-2" src="{{product.image}}">
              </a>
              <ul class="social">
                <li><a routerLink="/products" data-tip="Quick View"><i class="fa fa-eye"></i></a></li>
                <li><a href="#" data-tip="Add to Wishlist"><i class="fa fa-shopping-bag"></i></a></li>

              </ul>
              <span class="product-discount-label">40%</span>
              <a class="add-to-cart" href="">Add to cart</a>
            </div>
            <div class="product-content">
              <h3 class="title"><a routerLink="/categories">{{product.name}}</a></h3>
              <div class="price">
                {{product.price}}
                <span>{{product.mrp}}</span>
              </div>

{{filter_group.name}
名称



40%
{{product.name}
{{product.price}}
{{product.mrp}}

您正在使用包含

过滤器组

和

产品

的完整对象，并尝试循环它。通过数组而不是对象的角度循环

您需要更改订阅中的代码

 this.categoryService.getAllProduct().subscribe((data: Filter_group) => {
      this.filter_groups = data.filtergroups;
      this.products = data.products;
      console.log('filter group:', filter_groups );
      console.log('products:', products);
    });

---

您的结果是复杂对象包含2个属性。如果希望填充产品，则需要在订阅中为其分配：

this.products=filter\u groups.products

。

 this.categoryService.getAllProduct().subscribe((data: Filter_group) => {
      this.filter_groups = data.filtergroups;
      this.products = data.products;
      console.log('filter group:', filter_groups );
      console.log('products:', products);
    });