Как вызвать метод из filterFunction () в ng2-smart-таблице? - PullRequest
0 голосов
/ 29 мая 2018

Я пытаюсь вызвать метод из функции filterfunction () с помощью ключевого слова this.Однако я понимаю, что «this» относится к обработчику событий, а не к компоненту, и значение, которое я получаю для «this», равно нулю, поэтому я получаю ошибку времени выполнения.

export class SmartTableComponent {

  settings = {
    ...
    columns: {
      ...
      firstName: {
        title: 'First Name',
        type: 'string',
        filterFunction(cell?: any, search?: string): boolean {          
          return this.doFilter(cell, search);
        }
      },
      ...
    },
    ...
  };


  doFilter(cell?: any, search?: string): boolean{
    return true;
  }
}

В Java мы получили быссылка на 'this' с помощью SmartTableComponent.this.doFilter (...), но, похоже, это не работает в TypeScript.

Как вызвать метод компонента из функции filterFunction в ng2-smart-table

Ответы [ 2 ]

0 голосов
/ 01 июня 2018

Похоже, что при использовании лямбда-выражения вместо анонимной функции значение this сохраняется из класса-оболочки.Итак, вот решение:

export class SmartTableComponent {

  settings = {
    ...
    columns: {
      ...
      firstName: {
        title: 'First Name',
        type: 'string',
        filterFunction:(cell?: any, search?: string) => {
          return this.filterByText(cell.doc[0]['value'], search);
        },
      },
      ...
    },
    ...
  };


  doFilter(cell?: any, search?: string): boolean{
    return true;
  }
}

Я получил идею здесь: Angular 4, 'this' не определено при использовании функции обратного вызова 'onComponentInitFunction' для таблицы ng2-smart

0 голосов
/ 30 мая 2018

Проблема в том, что тот, кто вызывает эту функцию, установит переменную this , и поэтому ваше представление о том, что this означает в функции, изменилось.Чтобы прикрепить this к функции (и предотвратить ее изменение), вы можете использовать Bind .В следующем коде показан (надеюсь) рабочий пример.

export class SmartTableComponent {

  settings = {
    ...
    columns: {
      ...
      firstName: {
        title: 'First Name',
        type: 'string',
        filterFunction(cell?: any, search?: string): boolean {          
          return this.doFilter(cell, search);
        }.bind(this)
      },
      ...
    },
    ...
  };


  doFilter(cell?: any, search?: string): boolean{
    return true;
  }
}

Мое предыдущее объяснение более интуитивное, чем строго правильное, если вы действительно хотите знать, как оно работает, ознакомьтесь с https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this

...