Angular Primeng: Создать Observable из события lazyLoad - PullRequest
Новая
       14

Angular Primeng: Создать Observable из события lazyLoad

0 голосов
/ 05 июня 2019

Я закодировал этот html: 

<p-table #usersTable ...>
<p-table>

Я пытаюсь подобрать этот элемент, чтобы создать наблюдаемое событие onLazyLoad: 

@ViewChild('usersTable')
private usersTable: ElementRef;

Для создания наблюдаемой: 

public ngAfterViewInit() {
    let lazyTable$ = Observable
        .fromEvent(this.usersTable.nativeElement, 'onLazyLoad')
        .pipe(debounceTime(300));
}

Тем не менее, this.usersTable не определено.

С другой стороны, я совсем не уверен в правильности создания наблюдаемого события.

Я использовал 

@ViewChildren(DataTable) private usersTable: QueryList<DataTable>;

Тем не менее, при внесении изменения query.length всегда равно 0: 

let lazyClick$ = this.usersTable.changes
    .pipe(
        filter((query: QueryList<DataTable>) => {
            return query.length > 0;
        }),
        map((query: QueryList<DataTable>) => {
            return query.first;
        }),
        switchMap((table) => {
            return table.onLazyLoad.asObservable();
        })
    );

Есть идеи?

1 Ответ

1 голос
/ 05 июня 2019

Вы прокомментировали, что ваша таблица находится внутри div с *ngIf, вы можете использовать set content, чтобы получить ссылку на вашу таблицу. 

@ViewChild('usersTable') set content(usersTable: ElementRef) {
  if (usersTable) {
    let lazyTable$ = Observable
        .fromEvent(this.usersTable.nativeElement, 'onLazyLoad')
        .pipe(debounceTime(300));
  }
}

Таким образом, эта функция будетвыполнять при каждом изменении *ngIf изменение условия, то есть когда ваша таблица отображается или скрывается.

...