Блог

Я создал пользовательский компонент рендеринга для добавления кнопок в мой ng2-smart-table. Кнопки отображаются правильно, и я могу выполнить действие. Теперь я хочу обновить таблицу после завершения действия.

Как я могу этого добиться? Я добавил подписчика в настройках и отправляю событие из своего компонента, но из настроек, как я могу вызвать другую функцию для выполнения обновления исходного кода?

Ниже приведен код: Настройки:

 TableSettings = {
columns: {              
  documentId: {
    title: 'Document ID'
  },
 button: {
    title: 'Task Actions',
    type: 'custom',
    renderComponent: CustomButtonComponent,
    onComponentInitFunction :(instance: any) => {
      instance.retry.subscribe(row => {
       //TODO Refresh Table
    });}
  }
};
  

Пользовательский компонент рендеринга:

  export class CustomButtonComponent implements ViewCell, OnInit {
  renderValue: string;

  @Input() value: string | number;
  @Input() rowData: any;

  @Output() retry: EventEmitter<any> = new EventEmitter();

  constructor(){}

  onRetry() {   
    this.retry.emit(this.rowData);    
  }
}
  

Я пытался написать this.source.refresh(), но получаю ошибку, из-за которой не удается получить доступ к источнику свойства undefined.

Я использую оператор spread для обновления данных ng2 smart table:

this.config.results = […this.config.results];

Если вы поместите эту строку в свой код, где у вас есть маркер // TODO, я думаю, это сработает. Не уверен, потому что вы не предоставили демо 🙂

У Zendev есть хорошо читаемая базовая разбивка того, что здесь делает этот оператор. Я надеюсь, что это поможет!