Question

我正在尝试使用FormBuilder构建ion-select。我还没有找到FormBuilder的动态离子选择示例。因此，当我使用我的udnerstanding创建表单时，我正在

Runtime Error
Error trying to diff 'evaluator.id'. Only arrays and iterables are allowed

这是我的组件代码

constructor(public navCtrl: NavController, public navParams: NavParams,public viewCtrl: ViewController,
            public modalCtrl: ModalController,public formBuilder:FormBuilder) {

      this.fillEvaluators();

      this.cpoForm = this.formBuilder.group({
        evaluators:['', Validators.required]
      });
  }

和页面模板就像thos

 <ion-item>
        <ion-label>Evaluator</ion-label>
        <ion-select [(ngModel)]='evaluators' formControlName="evaluators">
            <ion-option *ngFor="let evaluator of evaluators" value="evaluator.id">{{evaluator.name}}</ion-option>
        </ion-select>
    </ion-item>

这里评估者是一个对象数组。

this.evaluators=[{
      id:2,
      name:"My Test Evaluators"
    }
    .....
}

系统信息：

Ionic Framework: 3.9.2
Ionic App Scripts: 3.1.8
Angular Core: 5.2.7
Angular Compiler CLI: 5.2.7
Node: 9.4.0
OS Platform: macOS High Sierra
Navigator Platform: MacIntel
User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.181 Safari/537.36

Answer 1

与Ionic的 docs 相同。使用[value]。

这是一个简单的例子：

<ion-item>
    <ion-label>Name(s)</ion-label>
    <ion-select [(ngModel)]="data.person" multiple>
        <ion-option *ngFor="#name of namesList" [value]="name.shortName" [checked]="false">{{name.shortName}}</ion-option>
    </ion-select>
</ion-item>

离子3，从离子选择中选择值后得到运行时错误

1 个答案: