单击事件 return 未定义。为什么?

Click event return undefined. Why?

我正在尝试传递从垫选项选项之一中获取的日期,但是当在垫选项标签中时,我放置了一个带有事件的点击方法并打印事件 returns undefined! 我该如何解决?

HTML

    <mat-drawer-content class="Font">
      <mat-form-field appearance="fill">
        <mat-label>choose the date
        </mat-label>
        <mat-select [(value)]="selected">
          <mat-option value="option1" (click)="onclick($event)">{{this.shareDate.newCurrentDate}}</mat-option>
          <mat-option value="option2" (click)="onclick($event)">{{this.shareDate.newTomorrow}}</mat-option>
        </mat-select>
      </mat-form-field>
      <mat-form-field >
        <mat-label>choose the time
        </mat-label>
        <mat-select #hasBackdrop>
          <mat-option [value]="false" *ngFor="let time of dayaHours">
            <div class="hourTime">{{formatTime(time.time)}}</div>
          </mat-option>
        </mat-select>
      </mat-form-field>
    </mat-drawer-content>
  </mat-drawer-container>

TS

onclick(event) {
  console.log(event.value); // undefined
}

你想做的事是不可能的,因为点击事件没有任何价值。 或者,我建议您执行以下操作:

<mat-option #matOption1 (click)="onClick(matOption1.value)" [value]="'GB'">Great Britain</mat-option>

我也创建了一个Stackblitz

更多信息您可以阅读:https://angular.io/guide/template-reference-variables