@ViewChild('tTaskTeam', { read: MatAutocompleteTrigger }) 升級到 V8 后不起作用

Question

嗨，我今晚將我的項目從 V7 升級到 V8，我在閱讀 @viewChild 時遇到了一堆錯誤，這是由於他們所做的新更新。 我將 { static: true } 添加到我所有的 @viewChild，但后來我遇到了這些觸發器，我設置如下：

 @ViewChild('tTaskTeam', { read: MatAutocompleteTrigger }) autoCompleteForTaskTeamTrigger: MatAutocompleteTrigger;
  @ViewChild('tofficeUser', { read: MatAutocompleteTrigger }) officeUsersautoCompleteInputTrigger: MatAutocompleteTrigger;
  @ViewChild('recipientType', { read: MatAutocompleteTrigger })  recipientTypeTrigger: MatAutocompleteTrigger;

viewChild只接受兩個參數，我不能添加三個。 所以我讀了： MatautocompleteTrigger ，它破壞了我的自動完成功能。

這是我收到的錯誤消息：

'{ 類型的參數讀取：typeof MatAutocompleteTrigger; }' 不能分配給類型為 '{ read?: any; 的參數靜態：布爾值； }'。 類型 '{ read: typeof MatAutocompleteTrigger; 中缺少屬性 'static' }' 但在類型 '{ read?: any; 中是必需的靜態：布爾值； }'.ts(2345) core.d.ts(8066, 9): 'static' 在這里聲明。

我添加了這些觸發器以在用戶輸入不是來自所選選項列表的字符時觸發。 所以它會清除並給用戶一條消息讓他們再次選擇。

這是完整的實現： HTML

<mat-form-field appearance="outline" class="task-info-form-field">
  <input tab-directive #tTaskTeam matInput (keyup.enter)="chooseFirstOption(autoCompleteForTaskTeam)" [matAutocomplete]="autoCompleteForTaskTeam" formControlName="tTaskTeam" matTooltip="You can search and it will try to autocomplete the name for you!" placeholder="Select Group">
  <mat-autocomplete #autoCompleteForTaskTeam='matAutocomplete' [displayWith]="displayTeamName">
    <mat-option class="matAutoCompleteSelect" *ngFor="let user of filteredOptions | async" [value]="user">
      <span>{{ user.TeamName }}</span>
    </mat-option>
  </mat-autocomplete>
  <mat-error>
    Value entered is NOT VALID please selected only from suggested values.
  </mat-error>
</mat-form-field>

TS

@ViewChild(MatAutocomplete, {
  static: true
}) autoCompleteForTaskTeam: MatAutocomplete;

@ViewChild('tTaskTeam', {
  read: MatAutocompleteTrigger
}) autoCompleteForTaskTeamTrigger: MatAutocompleteTrigger;

subscriptionTeam: Subscription;

ngAfterViewInit() {
  this._subscribeToClosingActions();
  this._subscribeToClosingActionsThree();
  this._subscribeToClosingActionsTwo();
}

ngOnDestroy() {
  if (this.subscription && !this.subscription.closed) {
    this.subscription.unsubscribe();
  }
  if (this.subscriptionTeam && !this.subscriptionTeam.closed) {
    this.subscriptionTeam.unsubscribe();
  }
  if (this.subscriptionUser && !this.subscriptionUser.closed) {
    this.subscriptionUser.unsubscribe();
  }
}


private _subscribeToClosingActions(): void {
  if (this.subscriptionTeam && !this.subscriptionTeam.closed) {
    this.subscriptionTeam.unsubscribe();
  }

  this.subscriptionTeam = this.autoCompleteForTaskTeamTrigger.panelClosingActions
    .subscribe(e => {

        if (!e || !e.source) {
          this.form.controls.tTaskTeam.setValue('');
        }
      },
      err => this._subscribeToClosingActions(),
      () => this._subscribeToClosingActions());
}

Answer 1

應該是

@ViewChild('tTaskTeam', { read: MatAutocompleteTrigger, static: false}) autoCompleteForTaskTeamTrigger: MatAutocompleteTrigger;

Answer 2

我不能評論所以我必須添加答案

https://v8.angular.io/guide/static-query-migration