import { Component, ViewChild, OnInit, AfterViewInit  } from '@angular/core';

import { Http } from '@angular/http';
import { Router } from '@angular/router';
import { Observable } from 'rxjs/Observable';

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, AfterViewInit  {
    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;
      });
    }

    ngAfterViewInit() {
      this.dataSource = new MatTableDataSource();
      this.dataSource.paginator = this.paginator;
      this.dataSource.sort = this.sort;
    }

    applyFilter(filterValue: string) {
      filterValue = filterValue.trim();
      filterValue = filterValue.toLowerCase();
      this.dataSource.filter = filterValue;
    }
  }