O documento resume as principais funcionalidades do framework AngularJS 1.0.8, incluindo binding de dados, eventos, Ajax, validações e rotas. O AngularJS é um framework JavaScript para desenvolvimento de aplicações SPA que carregam uma única página e se comunicam com o servidor via Ajax.
2. O Que É ?
Framework javascript para
desenvolvimento de aplicações
SPA (Single Page Application)
O Que é SPA ?
São aplicações web de uma única
página (embora possa apresentar mais
de uma), que uma vez carregada pelo
browser, se comunica com o servidor
de aplicação usando por exemplo AJAX.
3. O que eu ganho
com isso ?
• Velocidade
• Baixo consumo de banda
• Alta disponibilidade do servidor
• Perfeito para mobile
• Aplicações ajax padronizadas
4. Binding
Este recurso “liga” um
determinado objeto javascript a
um elemento html.
De forma que uma alteração no
valor do elemento é refletido
automaticamente no objeto e
vice-versa.
5. O que preciso para
usar o binding do
Angular?
• Diretiva (atributo colocado nos elementos html)
• Uma Expressão (Opcional)
9. Estrutura de uma aplicação
Angular
• Model (É um objeto Javascript)
• View (Seu html)
• Controller (Código javascript que conterá o código da aplicação)
11. Eventos
Eventos são utilizados através das diretivas. Para clique, ng-click.
Basta adiciona-la ao elemento e criar a função de resposta no
controller.
13. Para utilizar ajax nas nossas apps é necessário declarar um
parâmetro de nome http no Controller. O angular irá injetar (DI) o
objeto para que ele possa ser usado.
15. Rotas
Para fazer uso de rotas é necessário
criar um módulo que configura o
angular, informando nossas rotas,
templates e controllers que serão
responsáveis por cada view. É
necessário informar o nome desse
módulo na diretiva ng-app e criar
uma tag que será o container do
conteúdo das views, tendo esta a
diretiva ng-view.
16. Validações
As validações são diretivas colocadas
nos inputs e permitem executar
validações básicas. As diretivas
disponíveis são: ng-required, ng-
minlength, ng-maxlength e ng-pattern
(Aceita uma regex). A diretiva ng-
show é usada para avaliar uma
expressão, caso ela seja verdadeira,
uma mensagem de erro é exibida.
17. Exemplo de Rotas e Validações
http://angularrotasvalidacoes.codeplex.com/