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.

1. AngularJS 1.0.8
Binding, Eventos, Ajax, Validações e Rotas

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)

6. Binding Simples
http://angularbindingsimples.codeplex.com/

7. Uma outra opção de binding
da expressão
Utilize a diretiva ng-bind-template
<div class="mensagem" ng-bind-template="Olá {{visitante}}"></div>

8. Binding Ng-Binding-Template
http://angularbindingatributo.codeplex.com/

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)

10. Exemplo de Aplicação Angular
http://angularestrutura.codeplex.com/

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.

12. Exemplo de Evento
http://angularevento.codeplex.com/

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.

14. Exemplo de Ajax
http://angularajax.codeplex.com/

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/

18. Just It!
Ildyone Martins
@devmartins
Angularjs.org