javascript - 如何从 mat-list 字段中获取数据到输入字段中？

Question

我正在尝试将数据从一个mat-list字段获取到一个input字段。我试过了，getElementById但它不起作用。有什么解决办法吗？

这是我的代码：

<div class="material-input">
      <mat-form-field class="form-group" appearance="outline">
        <mat-label>First name</mat-label>
        <input matInput id="firstName" onchange="getDataFromList(this.value)" readonly formControlName="firstName">
        <mat-list id="listFirstName" *ngFor="let username of mockLdap | async">
          {{username?.firstName}}
        </mat-list>
      </mat-form-field>
    </div>

TS：

 getDataFromList(val) {
    (document.getElementById('listFirstName') as HTMLInputElement).value = val;
  }

标签： javascripthtmlangulartypescript