Как заполнить угловой материал с данными из JSON? - PullRequest
Новая
       27

Как заполнить угловой материал с данными из JSON?

0 голосов
/ 16 ноября 2018

У меня есть проект в угловом формате, и у меня есть данные углового материала.Итак, я хочу заполнить его данными из JSON.Потому что, когда я пытаюсь заполнить его, просто ничего не отображается, как будто пустое, но если я заполняю данные статическими данными, они показывают данные.Идея заключается в заполнении данных данными из json.

Ответы [ 2 ]

0 голосов
/ 27 ноября 2018

Пожалуйста, отметьте это, надеюсь, это поможет вам: 

this.http.get('servieurl').subscribe(data => 
{
 this.apps.push(data);
 this.displayedColumns = ['columnName'];
 this.dataSource = new MatTableDataSource(this.apps);
 }, error => console.error(error));

Html: 

<table mat-table [dataSource]="dataSource">
 ...
</table>

Для дополнительной проверки перейдите по этой ссылке: заполните угловой материал, содержащий данные из данныхJSON?

0 голосов
/ 16 ноября 2018

Вам нужно будет создать экземпляр MatTableDataSource с данными, полученными от вашего сервиса. 

dataSource;
data;

ngOnInit() {
  this.yourService.getData()
    .subscribe((data: Type[]) => {
      this.data = data;
      this.dataSource = new MatTableDataSource(data);
    });
}

А затем в вашем шаблоне используйте это: 

<table mat-table [dataSource]="dataSource" class="mat-elevation-z8">
  ...
</table>

Обратите внимание, что ответственность за получение данных из бэкэнда лежит на Сервисе, и вы просто вызовете метод для получения данных.

Вот Образец StackBlitz для вашей ссылки. Здесь я получаю список пользователей из JSONPlaceholder API и затем показываю его в шаблоне, устанавливая его dataSource

...