我想向用户显示0 - >术语到下拉列表
Plase check https://stackblitz.com/edit/ionic-djze7u
home.html的
<ion-content padding>
<ion-card>
<ion-card-content *ngFor="let item of users">
<ion-row>
<ion-label>{{item.name}}:</ion-label>
<ion-label>{{item.age}}</ion-label>
<ion-select [(ngModel)]="count">
<ion-option value="0" selected>0</ion-option>
//这是问题 - &gt;如何再次使用ngfor制作lopp? //以及如何将i的值打印到user.terms?
<ion-option ngfor="let i of item.term" value="{{i}}" >
{{i}}
</ion-option>
</ion-select>
</ion-row>
</ion-card-content>
</ion-card>
</ion-content>
home.ts
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {
users:any = [
{ name: 'Composite Factory', age: 1, term:2 },
{ name: 'Todd', age: 2, term:1 },
{ name: 'Lisa', age: 3, term:4 }
];
constructor(public navCtrl: NavController) {
}
}
答案 0 :(得分:2)
实际上ngFor是错误的,请将其更改为
<ion-content padding>
<ion-card>
<ion-card-content *ngFor="let item of users">
<ion-row>
<ion-label>{{item.name}}:</ion-label>
<ion-label>{{item.age}}</ion-label>
<ion-select [(ngModel)]="count">
<ion-option value="0" selected>0</ion-option>
<ion-option *ngFor="let i of users" [value]="i.term" >
{{i.term}}
</ion-option>
</ion-select>
</ion-row>
</ion-card-content>
</ion-card>
</ion-content>
答案 1 :(得分:0)
数组名称应为users
。另外,使用ngValue
分配值。
<ion-option *ngFor="let i of users" [ngValue]="i.term" >
{{i.term}}
</ion-option>