Last active
December 1, 2018 01:31
-
-
Save fabiogoll/f9c77927d77d3f556326c59e62cb1071 to your computer and use it in GitHub Desktop.
[Angular2] Implementação da Paginação no projeto
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import {Paginacao, PaginacaoRequest} from "../utils/paginacao"; | |
buscarClientePorFilial(filialId: number, pr: PaginacaoRequest): Promise<Paginacao> { | |
var self = this; | |
return new Promise<Paginacao>((resolve, reject) => { | |
var resposta: Resposta = new Resposta(TipoErro.ERROR, "Erro na busca de clientes!"); | |
if (filialId === 0) { | |
resposta.motivo.push("Código da filial não pode ser nula!"); | |
reject(resposta); | |
} | |
self.service.buscarClientePorFilial(filialId, pr).then(retorno => { | |
if (retorno.dados === null || retorno.dados.length === 0) { | |
resposta.motivo.push("Filial não possui clientes cadastrados"); | |
reject(resposta); | |
} | |
resolve(retorno); | |
}, reject); | |
}); | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<paginacao [paginacao]="paginacao" | |
(paginaAlterada)="mudarPagina($event)"></paginacao> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { Paginacao, PaginacaoRequest } from "../../app/web-mobile-share/utils/paginacao"; | |
@Component({ | |
moduleId: module.id, | |
directives: [ | |
ROUTER_DIRECTIVES, | |
PaginacaoComponent | |
], | |
templateUrl: "./clientes-lista.component.html" | |
}) | |
export class ClientesListaPage implements OnInit { | |
public clientes: Array<Cliente> = []; | |
public paginacao: Paginacao = new Paginacao(null); | |
ngOnInit() { | |
console.log("onInit clientes lista"); | |
this.buscarClientePorFilial(1, new PaginacaoRequest(this.paginacao)); | |
} | |
buscarClientePorFilial(filial: number, pr: PaginacaoRequest){ | |
this._clienteServiceBO.buscarClientePorFilial(filial, pr).then((res: Paginacao) => { | |
res.paginaAtual = this.paginacao.paginaAtual; | |
this.paginacao = res; | |
// res.dados.forEach(element => { | |
// this.clientes =.push(element); | |
// }); | |
this.clientes = res.dados; | |
}, (resposta) => { | |
this.erroRequisicao = Object.assign({}, resposta); | |
console.log(this.erroRequisicao); | |
}); | |
} | |
mudarPagina(event: number){ | |
this.paginacao.paginaAtual = event; | |
this.buscarClientePorFilial(1, new PaginacaoRequest(this.paginacao)); | |
} | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { Paginacao, PaginacaoHelper, PaginacaoRequest } from "../../app/web-mobile-share/utils/paginacao"; | |
public buscarClientePorFilial(filialId: number, pr: PaginacaoRequest): Promise<Paginacao> { | |
return new Promise((resolve, reject) => { | |
this._http.get(this._endPoint + "buscar-por-filial/" + filialId, { headers: conteudoCabecalho, search: pr.getParams() }).toPromise() | |
.then((res: Response) => { | |
resolve(new Paginacao(<Cliente[]> res.json(), PaginacaoHelper.getTotalCount(res.headers))); | |
}, reject) | |
.catch(erro => { | |
console.error(erro.message); | |
}); | |
}); | |
} |
Vou testar no meu projeto... valeu.. !
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Basicamente são 3 classes:
Paginacao: objeto com todas as informações para o componente paginacao-component
PaginacaoRequest: é populado comos parametros que vão para o request
PaginacaoHelper: método para pegar o total de registros do cabeçalho do response
E o componente: paginacao-component.ts
<paginacao></paginacao>