使用ngModel附加id

时间:2017-02-08 11:20:13

标签: angularjs ionic2

循环遍历范围变量extra时,我使用item.id获取ID。现在,我想将item.id附加BookingConfirmationFormsState,以便它变为例如BookingConfirmationFormsState35

当我运行以下代码时出现错误

ORIGINAL EXCEPTION: Cannot read property '35' of undefined

以下是我目前正在使用的内容。

HTML

<form (ngSubmit)="ContinueBookingConfirmation()">
    <ion-row *ngFor="let item of extra" class="row-extra" id="extra-item-{{ item.id }}">
        <ion-col width-10>
            <ion-checkbox class="switcher display-block" color="secondary" [(ngModel)]="BookingConfirmationFormsState[item.id]" name="checkbox" [checked]="true"></ion-checkbox>
        </ion-col>
        <ion-col width-67 class="description">{{ item.description }}</ion-col>
        <ion-col width-23 style="text-align: right;">
            <div class="rate text-center display-block">FJ ${{ item.rate }}</div>
            <div class="qty text-center display-block"><input type="number" min="1" max="100" class="text-center" [(ngModel)]="BookingConfirmationFormsQty[item.id]" name="qty" /></div>
        </ion-col>
    </ion-row>
    <ion-row>
        <ion-col>
            <ion-col width-100 class="text-center"><button type="submit" class="continue">Continue</button></ion-col>
        </ion-col>
    </ion-row>
</form>

打字稿

export class BookingEnhancementPage {
  BookingConfirmationFormsState35: string;
  BookingConfirmationFormsState36: string;
  BookingConfirmationFormsState37: string;

  BookingConfirmationFormsQty35: number;
  BookingConfirmationFormsQty36: number;
  BookingConfirmationFormsQty37: number;

  constructor(public navCtrl: NavController, public navParams: NavParams, public loadingCtrl: LoadingController, private formBuilder: FormBuilder ) {}

  ContinueBookingConfirmation(){
    console.log( this.BookingConfirmationFormsState35 );
    console.log( this.BookingConfirmationFormsState36 );
    console.log( this.BookingConfirmationFormsState37 );
  }

}

0 个答案:

没有答案