Upload
evaldo-barbosa
View
36
Download
2
Embed Size (px)
Citation preview
estendendo o html com diretivas
AngularJSUm exemplo de como construir aplicações HTML componentizadas
/apresentação
Evaldo BarbosaAnalista de Sistemas
Presidente do PHP Maranhão
Membro da diretoria da ABRAPHP
/estabelecendo_o_problema
Uma todo listUm problema, alguns dados e dois componentes.
/estabelecendo_o_problema
Uma todo listUm problema, alguns dados e dois componentes.
<todo-list title=”Título da lista”> <task title=”Task” done=”boolean” blocked=”boolean”></todo-list>
/dependencias
Bower.jsonPreparando o campo para o jogo
bower install –save angular font-awesome bootstrapbower init
/meio_de_campo
O módulo e o controllerUm controller simples: basicamente dados.
/app/app.js
/html
Template das diretivasComo usar as diretivas na página
/app/view/todo-list.html/app/view/task.html
/implementação
Criando as diretivasComo chamaremos a diretiva no HTML
Restrict
/implementação
Criando as diretivasQual a forma de implementar o HTML da diretiva
Template e TemplateUrl
/implementação
Criando as diretivasSubstitui o HTML da tag pelo do template
Replace
/implementação
Criando as diretivasReserva uma área do template para receber dados da chamada
Transclude
/implementação
Criando as diretivasInterceptando dados e alterando a saída
Link
/github
O repositórioO código e as referências
https://github.com/evaldobarbosa/diretivasAngularjs
Pronto para deployREADME com referências
ObrigadoPerguntas?
br.linkedin.com/in/evaldobarbosagithub.com/evaldobarbosatwitter.com/evaldobarbosafacebook.com/evaldo.barbosa.902