пустые данные после получения данных

Question

Я использую primeng datatable для предварительного просмотра данных.

Я использую сервис для получения данных из json.

this.searchUserService.getResultART().then(data => {
  console.log(data); // data is OK
  for (let i = 0; i < data.length; i++) {
    this.usersList.push(new User(data[i]));
  }
  console.log("user list ", this.usersList); // list OK
});

В HTML я создаю свой datatable

<p-dataTable [value]="usersList" selectionMode="single"  [(selection)]="selectedUser" dataKey="uid" (onRowSelect)="selectedUserDetails($event)" styleClass="tab-result"  >
  <p-column field="uid" header="UID" [sortable]="true"></p-column>
  <p-column field="firstName" header="First Name" [sortable]="true"></p-column>
  <p-column field="lastName" header="Last Name" [sortable]="true"></p-column>
  <p-column field="buildingAdress" header="Address" [sortable]="true"></p-column>
  <p-column field="profile" header="Role" [sortable]="true"></p-column>
</p-dataTable>

На экране отображается пустая таблица без сообщения о записях.

Console.log показывает правильные данные, я не знаю, почему таблица еще пуста

Answer 1

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

В вашем обратном вызове попробуйте создать новыймассив, вызвав Array.concat() в существующем массиве с недавно сопоставленными результатами из данных.Это должно инициировать обнаружение изменений в компоненте, потому что теперь ссылка, передаваемая на вход, изменилась.

this.searchUserService.getResultART().then(data =>
  this.usersList = this.usersList.concat(data.map(x => new User(x)));
);