Невозможно установить свойство filterPredicate для неопределенной ошибки в угловой таблице материалов - PullRequest
Новая
       17

Невозможно установить свойство filterPredicate для неопределенной ошибки в угловой таблице материалов

0 голосов
/ 13 декабря 2018

У меня есть угловая таблица материалов с фильтрацией на стороне клиента, в которой я получаю данные из службы.В то время как мои фильтры работали с жестко закодированными данными, я получаю сообщение об ошибке: «Невозможно установить свойство filterPredicate» неопределенного с тех пор, как я переключился на получение данных из службы.Данные отображаются в моей таблице правильно, но я не могу их отфильтровать. 

export class MessageTableComponent implements OnInit {
    datasource: any;
}
    ngOnInit() {

        this.messageService.getMessageTableData().subscribe(
          response => {
            this.dataSource = new MatTableDataSource(response);
            console.log(response);
          }
        );

        this.RequestIdFilter.valueChanges.subscribe((RequestIdFilterValue) => {
          this.filteredValues['RequestID'] = RequestIdFilterValue;
          this.dataSource.filter = JSON.stringify(this.filteredValues);
          });

          this.RequestStatusFilter.valueChanges.subscribe((RequestStatusFilterValue) => {
            this.filteredValues['RequestStatus'] = RequestStatusFilterValue;
            this.dataSource.filter = JSON.stringify(this.filteredValues);
            });

          this.RequestorNameFilter.valueChanges.subscribe((RequestorNameFilterValue) => {
            this.filteredValues['RequestorName'] = RequestorNameFilterValue;
            this.dataSource.filter = JSON.stringify(this.filteredValues);
          });

          this.ApproverNameFilter.valueChanges.subscribe((ApproverNameFilterValue) => {
            this.filteredValues['ApproverName'] = ApproverNameFilterValue;
            this.dataSource.filter = JSON.stringify(this.filteredValues);
          });

          this.SubjectFilter.valueChanges.subscribe((SubjectFilterValue) => {
            this.filteredValues['Subject'] = SubjectFilterValue;
            this.dataSource.filter = JSON.stringify(this.filteredValues);
          });

          this.MessageStatusFilter.valueChanges.subscribe((MessageStatusFilterValue) => {
            this.filteredValues['MessageStatus'] = MessageStatusFilterValue;
            this.dataSource.filter = JSON.stringify(this.filteredValues);
            });

            this.SubmissionFromDateFilter.valueChanges.subscribe((SubmissionFromDateFilterValue) => {
              this.filteredValues['SubmissionFromDate'] = SubmissionFromDateFilterValue;
              this.dataSource.filter = JSON.stringify(this.filteredValues);
            });

            this.SubmissionToDateFilter.valueChanges.subscribe((SubmissionToDateFilterValue) => {
              this.filteredValues['SubmissionToDate'] = SubmissionToDateFilterValue;
              this.dataSource.filter = JSON.stringify(this.filteredValues);
            });



        this.dataSource.filterPredicate = this.customFilterPredicate();

        this.dataSource.sort = this.sort;


      }

customFilterPredicate() {
.....
}

Ошибка, по-видимому, во второй последней строке.messageService - это служба, которую я использую для извлечения данных, а остальная часть кода предназначена для фильтрации данных в любое время, когда изменяется значение любого из столбцов.Ниже у меня есть функция customFilterPredicate, определяющая фильтры для каждого столбца.

Я не понимаю, в чем проблема.Я определил источник данных в ngOnInit, так почему возникает ошибка и как ее устранить?

1 Ответ

0 голосов
/ 13 декабря 2018

звонок от вашего сервиса не был возвращен, когда строка this "this.dataSource.filterPredicate = this.customFilterPredicate ();"выполнено ...

мы знаем, что асинхронные вызовы могут занимать время (по сравнению с извлечением жестко закодированных данных) ... 

this.dataSource.filterPredicate = this.customFilterPredicate();
this.dataSource.sort = this.sort;

попробуйте поместить эти 2 строки (выше) внутри службыВызовите блок finally, я также включил блок ошибок, который вы всегда должны обрабатывать при любых ошибках ... 

   this.messageService.getMessageTableData().subscribe(
          response => {
            this.dataSource = new MatTableDataSource(response);
            console.log(response);
          }
          ,errorResponse => { console.log(errorResponse); }
          ,()=> { 
            this.dataSource.filterPredicate = this.customFilterPredicate();
            this.dataSource.sort = this.sort;
            }
            );
...