TypeError: Невозможно прочитать свойство'acity 'из неопределенного

Question

Перед использованием интерфейса он работал без сбоев. Затем я реализовал интерфейс в своем коде TS и столкнулся с проблемой. Я не знаю, что мне не хватает.

создал интерфейс, а затем применил его с помощью объекта интерфейса.

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;. Отсюда и неопределенное исключение.