Último exemplo, https://material.angular.io/components/table/examples. Mas
mudei para buscar da base de dados. As informações vem do banco de dados.
Meu código
import { Component, ViewChild, OnInit } from '@angular/core';
import { Http } from '@angular/http';
import { Router } from '@angular/router';
import {MatPaginator, MatSort, MatTableDataSource} from
'@angular/material';
import { Estado } from '../model/estado.model';
import { EstadoService } from './estado.service';
@Component({
selector: 'app-estado',
templateUrl: './estado.component.html',
styleUrls: ['./estado.component.css']
})
export class EstadoComponent implements OnInit {
displayedColumns = ['pais', 'descricao', 'sigla'];
dataSource: MatTableDataSource<Estado>;
@ViewChild(MatPaginator) paginator: MatPaginator;
@ViewChild(MatSort) sort: MatSort;
estados: Estado[];
constructor(private router: Router, private estadoService :
EstadoService) { }
ngOnInit() {
this.estadoService.todos().subscribe(
(data :any) => {
this.estados = data.lista;
this.dataSource = new MatTableDataSource(this.estados);
});
}
ngAfterViewInit() {
this.dataSouce = new MatTableDataSource();
this.dataSource.paginator = this.paginator;
this.dataSource.sort = this.sort;
}
applyFilter(filterValue: string) {
filterValue = filterValue.trim(); // Remove whitespace
filterValue = filterValue.toLowerCase(); // Datasource defaults
to lowercase matches
this.dataSource.filter = filterValue;
}
}
Quando entro na página, ele ainda não carregou a informação no banco de
dados e por isto não tem resultado neste momento, conforme imagem.
Primeiro ele carrega o componente MatTableDataSource no metodo
ngAfterViewInit(). depois ele consulta a base de dados no método ngOnInit.
Deveria ser ao contrário.
O que pode ser ?
--
You received this message because you are subscribed to the Google Groups
"Angular and AngularJS discussion" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
