web-dev-qa-db-ja.com

@ViewChild（ 'ttaskteam'、{読み取り：MatautoCompletetrigger}）がV8にアップグレードした後に機能しない

こんにちは私は私のプロジェクトを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は2つのパラメータを受け入れ、もう3つ追加できません。だから私は読みました：MatautocompleteTrigger outし、それは私が行っていた私のオートコンプリート関数を破った。

これが私が取得しているエラーメッセージです：

Typeの引数 '{read：typeof matautocompletetrigger; '' {読み取り？：any any？静的：ブール; '。プロパティ 'static'はtype '{read：matautocompletetriggerを読みます。 'type' {読む？静的：ブール; '。'。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());
}
 _
angularangular7upgradeangular8
8
elquesogrand

私は答えを追加する必要があるのでコメントすることはできません

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

1
Damian Pioś