我有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错误错误:尝试区分'[对象 宾语]'。仅允许数组和可迭代对象
service.ts
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.ts
this.route.queryParams.subscribe(params => {
this.subcat = params ['=='];
this.childcat = params ['fil_outlet'];
if (this.subcat){
this.categoryService.getAllProduct().subscribe((filter_groups: Filter_group[]) => {
this.filter_groups = filter_groups;
console.log('new Query Params:', filter_groups);
});
}
});
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>
答案 0 :(得分:0)
您要占用同时具有filter_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);
});