时间戳

首页 > 解决方案 > 如何使用从以前的离子选择中选择的数组动态填充离子选择

angular - 如何使用从以前的离子选择中选择的数组动态填充离子选择

问题描述

所以我得到了一个对象数组，这些对象是具有 id、name 和 subccategory 等属性的类别。

我已经使用 *ngFor 来填充第一个离子选择，这很好。

我需要知道如何使用所选类别（第一个离子选择）中的子类别填充第二个离子选择 Iv 尝试将所选值作为数组传递，但我显然做错了，请帮忙！

    <ion-row class="filterItems" color="primary">
    <ion-label>Category</ion-label>
    <ion-select>
      <ion-select-option *ngFor="let catagory of catagories">
        {{ catagory.category }}
      </ion-select-option>
    </ion-select>
  </ion-row>

  <ion-row>
    <ion-label>Sub Category</ion-label>
    <ion-select>
      <ion-select-option>{{Need the subcatagorys in here}} </ion-select-option>
    </ion-select>
  </ion-row>

标签： angulartypescriptionic-frameworkangular8ngfor

解决方案

您可以使用(ionChange)事件来填充您的子类别数组。

<ion-row class="filterItems" color="primary">
    <ion-label>Category</ion-label>
    <ion-select [(ngModel)]="selecTedValue" (ionChange)="selectCategory(selecTedValue)">  // pass your selecTedValue ngModel as parameter
      <ion-select-option *ngFor="let catagory of catagories" value="{{category}}">
        {{ catagory.category }}
      </ion-select-option>
    </ion-select>
  </ion-row>

  <ion-row>
    <ion-label>Sub Category</ion-label>
    <ion-select>
      <ion-select-option *ngFor="let subCat of sub_category">{{subCat.subCategoryNameOrValue}} </ion-select-option>
    </ion-select>
  </ion-row>

在您的 page.ts 中为子类别获取一个变量。

sub_category:any;


selectCategory(catagory){
  this.sub_category = category; //populate here
}

推荐阅读