Угловой 7: динамически добавлять строки в таблицу данных материала - PullRequest
Новая
       56

Угловой 7: динамически добавлять строки в таблицу данных материала

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

Как мне добавить данные, которые я получаю от службы, в мою таблицу данных динамически?

Я получаю данные из диалога с сервисом AuthenticationService.Моей первой мыслью было использовать this.dataSource.push(this.transaction);, который не работает.

Вот как я пытался это сделать: 

export class TransactionPoolComponent implements OnInit {
  displayedColumns = ['sender', 'recipient', 'amount', 'fee'];
  dataSource = ELEMENT_DATA;
  transaction: Transaction;


  constructor(private _AS: AuthenticationService) {
  }

  ngOnInit() {
    this._AS.transaction$.subscribe( transaction => {
      this.transaction = transaction;
      this.dataSource.push(this.transaction);
      console.log(this.transaction);
      }
    );
  }
}

export interface Transaction {
  sender: number;
  recipient: string;
  amount: number;
  fee: string;
}

const ELEMENT_DATA: Transaction[] = [
];

Ответы [ 2 ]

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

Вы должны изменить ссылку на источник данных.

this.dataSource = new DataSource (новый массив (старый + новое отправленное значение))

Редактировать: 

Because you don't use **DataSource**, you can do the following
temp = this.datasource.slice();
temp.push(value);
this.datasource = temp;
0 голосов
/ 15 декабря 2018

Это должно работать, если вы видите, что данные добавляются.Вам нужно вручную вызвать detectChanges, чтобы обновлять пользовательский интерфейс.вы можете сделать то же самое с detectChanges ()

, который вам нужно внедрить внутри конструктора, как, 

constructor(private ref: ChangeDetectorRef) {

после назначения данных просто вызовом, 

this.dataSource.push(this.transaction);
this.ref.detectChanges();

также еще одна ошибка, вам нужно поместить элемент в массив, а затем преобразовать в dataTable, 

this.ELEMENT_DATA.push(this.transaction);
this.dataSource = new DataSource(this.ELEMENT_DATA));
...