首页 > 解决方案 > 在没有 optgroup 的下拉列表中分组 *ngFor 值

问题描述

如何在下拉选择中对没有 optGroup 的 *ngFor 数据进行分组。下面是我的 JSON 文件链接 JSON 数据

打字稿代码

   getProducts() {
      if (this.products.length < 1) {
        this.productService.getProducts().subscribe(p => {
        this.masterProductAttributeItems = p.MasterProductAttributeItems;
      });
    } 

html代码

<select class="form-control input-sm">
   <ng-container *ngFor="let thing of masterProductAttributeItems">
      <option value="{{ thing.MasterProductAttributeItemId }}">
        {{ thing.Name }}
      </option>
   </ng-container>
</select> 

目前它的表现如何

标签: angulartypescript

解决方案


由于您提供Name的不是您提供的 JSON 独有的。在这里,所有名称都以“重量”的形式给出。所以我只是改变了这段代码

 <option value="{{ thing.MasterProductAttributeItemId }}">
        {{ thing.Name }}
 </option>

<select class="form-control input-sm">
<ng-container *ngFor="let thing of masterProductAttributeItems">

   <option value="{{ thing.MasterProductAttributeItemId }}">
   {{ thing.MasterProductAttributeItem }}
   </option>
</ng-container>

如需更多演示,请参阅此链接:

https://stackblitz.com/edit/angular-xamcuh?file=src%2Fapp%2Fapp.component.html


推荐阅读