如何在阵列离子段在离子2
问题描述:
在这里过滤器的目的是我的下面代码如何在阵列离子段在离子2
.html文件
<ion-segment [(ngModel)]="kmart" color="primary">
<ion-segment-button value="All">
All
</ion-segment-button>
<ion-segment-button *ngFor="let tabName of buttonName" value={{tabName.product_type}}>
{{tabName.product_type}}
</ion-segment-button>
{{demo.name}} {{demo.name}} 名
.TS文件
demoObj = [ {"product_id": "52","name": "Apple - Fuji","product_type": "Fruits"},
{"product_id": "53","name": "bana - Fuji","product_type": "Fruits"},
{"product_id": "54","name": "beetroot - Fuji","product_type": "Vegitables"},
{"product_id": "55","name": "beens - Fuji","product_type": "Vegitables"},
{"product_id": "56","name": "mango - Fuji","product_type": "Fruits"}
];
buttonName = [{"product_type": "Fruits"},{"product_type": "Vegitables"}]
问题:
我能够在离子段来显示PRODUCT_TYPE但我不能够显示conent即demoObj。
在点击水果或Vegitables我需要只显示particualr对象在它例如:
如果我点击Vegitables然后我需要显示只有beetroot - Fuji
和beens - Fuji
这同样应该发生的水果。
我想我不能指定value="demo.product_type"
和* ngSwitchCase =“'demo.product_type'”这两个都不匹配,这就是我无法显示名称。
答
尝试:
<ion-segment [(ngModel)]="kmart" color="primary">
<ion-segment-button *ngFor="let tabName of buttonName" value={{tabName.product_type}}>
{{tabName.product_type}}
</ion-segment-button>
</ion-segment>
<div [ngSwitch]="kmart" *ngFor = "let demo of demoObj">
<ion-list *ngSwitchCase="demo.product_type">
<ion-item>
{{demo.name}}
</ion-item>
</ion-list>
</div>
initally凯马特是 '水果'。
希望这会有所帮助!
请检查我的更新问题.html部分我有两种类型的段按钮我fruts和蔬菜显示正确,但我的'所有'段按钮显示不正确任何想法你有 –