带芯片的 Ionic 4 Form 组

Question

我有一个离子应用程序，它应该有一个显示芯片列表的视图。应该有可能添加和删除筹码。因此，我想通过列表和表单组上的双向绑定来实现。这给了我错误。由于我对 ionic 还很陌生，所以我也对其他实现这个想法的技术持开放态度。

uncaught (in promise): Error: No value accessor for form control with name: exampleChips

example.page.ts

<ion-card class="form-group">
      <ion-card-content>
        <ion-list >
          <ion-chip class="form-control" name="exampleChips" id="exampleChips" [(ngModel)]="exampleModel.exampleChips" *ngFor="let example of exampleModel.exampleChips">
            <ion-label>{{example}}</ion-label>
          </ion-chip>
        </ion-list>
      </ion-card-content>
    </ion-card>

Answer 1

您需要在此处删除您的 ngModel。我们不需要它。

<ion-card class="form-group">
  <ion-card-content>
    <ion-list >
      <ion-chip class="form-control" name="exampleChips" id="exampleChips" *ngFor="let example of exampleModel.exampleChips">
        <ion-label>{{example}}</ion-label>
      </ion-chip>
    </ion-list>
  </ion-card-content>
</ion-card>

带芯片的 Ionic 4 Form 组

Ionic 4 Form Group with Chips

data-binding

directive

ionic-framework

angular