Question

在使用Interface之前，它运行平稳。然后，我在TS代码中实现了Interface并面临问题。我不是我想念的。

创建接口，然后使用接口对象进行应用。

HTML文件

<ion-content class="ion-padding">
  <ion-item>
    <ion-label position="floating">Class Code</ion-label>
    <ion-input type="text" [(ngModel)]="code"></ion-input>
  </ion-item>
  <ion-item>
    <ion-label position="floating">Class Name</ion-label>
    <ion-input type="text" [(ngModel)]="name"></ion-input>
  </ion-item>
  <ion-item>
    <ion-label position="floating">Instructor Name</ion-label>
    <ion-input type="text" [(ngModel)]="instructor"></ion-input>
  </ion-item>
  <ion-item>
    <ion-label position="floating">Class Capacity</ion-label>
    <ion-input type="number" [(ngModel)]="capacity"></ion-input>
  </ion-item>
  <ion-item>
    <ion-label position="floating">Location</ion-label>
    <ion-input type="text" [(ngModel)]="location"></ion-input>
  </ion-item>
  <div>
    <p>
      <ion-button color="success" expand="block" (click)="btnSubmit()" size="small" [disabled]="!code || !name || !instructor || !capacity || !location ">Submit</ion-button>
    </p>
    <ion-button color="danger" expand="block" (click)="btnCancel()" size="small">Cancel</ion-button>
  </div>
</ion-content>

Ts文件

export class AddcoursePage implements OnInit {
      private classData: ClassDescription;
      constructor(public navCtrl: NavController,
                  public firestore: AngularFirestore,
                  public toastCtrl: ToastController) {}


async btnSubmit() {
   this.classData.remaining = this.classData.capacity;
    const res =             
    this.firestore.collection('/class').doc(this.classData.code).set({
    Code: this.classData.code,
    Name: this.classData.name,
    Instructor: this.classData.instructor,
    Capacity: this.classData.capacity,
    Location: this.classData.location,
    Remaining: this.classData.remaining,
    Register: false
  })

我希望使用接口加载数据

Answer 1

似乎this.classData在undefined第一行是btnSubmit()

您的代码中没有private classData: ClassDescription;的初始化。因此，未定义的异常。

TypeError：无法读取未定义的属性“容量”

1 个答案: