Angular 9 - локальная ссылка, #, дочерний вид, @ViewChild - PullRequest
Новая
       6

Angular 9 - локальная ссылка, #, дочерний вид, @ViewChild

3 голосов
/ 26 февраля 2020

Я недавно обновил свой проект до angular 9.

Проблема: -

У меня возникла проблема с локальной ссылкой ('#') в шаблоне .

Я получаю значение как «неопределенное».

Цель: Я пытаюсь закрыть выбор циновки на свитке.

Код:

Html

<mat-select (selectionChange)="showDataForLocation($event)"
            [(value)]="dataService.startinglocation"
            (openedChange)="selectPanelOpened($event)" 
            #mySelect>

      <mat-option  aria-selected="true" [value]="location.ExLocationName" 
                  *ngFor="let location of startingPointData?.ExLocation"> 
                    {{location.ExLocationName}}
      </mat-option>
</mat-select>

Код TS 

@ViewChild('mySelect', { static: true }) mySelect;

@HostListener('window:scroll', [])
  onWindowScroll() {

    this.mySelect.close();
  }

Вышеописанное отлично работало на Angular 5, однако теперь выдает ошибку на 9. 


Uncaught TypeError: Cannot read property 'close' of undefined
    at DetailComponent.onWindowScroll (detail.component.ts:1378)
    at DetailComponent_scroll_HostBindingHandler (detail.component.ts:77)
    at executeListenerWithErrorHandling (core.js:21593)
    at wrapListenerIn_markDirtyAndPreventDefault (core.js:21635)
    at platform-browser.js:934
    at ZoneDelegate.invokeTask (zone-evergreen.js:400)
    at Object.onInvokeTask (core.js:40744)
    at ZoneDelegate.invokeTask (zone-evergreen.js:399)
    at Zone.runTask (zone-evergreen.js:168)
    at ZoneTask.invokeTask [as invoke] (zone-evergreen.js:481)

Ответы [ 2 ]

3 голосов
/ 26 февраля 2020

Вы должны изменить флаг stati c на false. 

// query results available in ngOnInit
@ViewChild('foo', {static: true}) foo: ElementRef;

OR

// query results available in ngAfterViewInit
@ViewChild('foo', {static: false}) foo: ElementRef;

Более подробная информация об этом топи c официальном руководстве по миграции Angular: https://angular.io/guide/static-query-migration

0 голосов
/ 26 февраля 2020

попробуйте это: 

@ViewChild('mySelect', { static: true }) mySelect: matSelect;

@HostListener('window:scroll', [])
  onWindowScroll() {

    this.mySelect.close();
}
...