AngularJS
Objetivo 
 Este guia tem como objetivo fornecer informações de acesso rápido para 
consultas de tópicos relacionados ao A...
Ferramentas 
JSBin para testes em pequena escala 
Visual Studio 
quando envolver vários arquivos e testes em larga escala
Conceitos AngularJS 
Introdução 
• Open-source 
• Inteiramente executado no browser 
• Javascript 
• Mantido pela Google 
...
Conceitos AngularJS 
Model View “Whatever” 
• Não depende de MVVM ou 
MVC 
• Flexibilidade para estruturar 
como bem enten...
Web Browser 
AngularJS ASP.NET 
Class Library 
Business 
App Index.html 
Module 
Directivies Routes 
Templates 
Views 
Con...
Vamos ao código 
Hello World! 
 Referenciar angular.js 
 Declarar ng-app na tag root da aplicação 
 Usar como bem enten...
Vamos ao código 
Two way data-binding 
 A declarativa ng-model faz menção à alguma propriedade do viewmodel 
<html ng-app...
Wesley A.Lemos 
Lages/SC - 2014
Próximos SlideShares
Carregando em…5
×

SPA Jumpstart - Angular - 1 - Introdução

595 visualizações

Publicada em

Curso ministrado por mim na NDDigital sobre como iniciar uma aplicação AngularJS direcionada ao consumo de uma WebAPI, baseado neste fluxo:
https://www.examtime.com/pt-BR/p/1084807

::Table of Contents

1 - Introdução
http://pt.slideshare.net/anisanwesley/angular-jumpstart-1-introduo-38460785

2 - Arquitetura
http://pt.slideshare.net/anisanwesley/angular-jumpstart-2-arquitetura

3 - Controllers
http://pt.slideshare.net/anisanwesley/angular-jumpstart-3-controllers

4 - Diretivas nativas
http://pt.slideshare.net/anisanwesley/angular-jumpstart-4-diretivas-nativas

5 - Diretivas customizadas
http://pt.slideshare.net/anisanwesley/angular-jumpstart-5-diretivas-customizadas

6 - Filters
http://pt.slideshare.net/anisanwesley/angular-jumpstart-6-filters

7 - Validação
http://pt.slideshare.net/anisanwesley/angular-jumpstart-7-validao

8 - Services
http://pt.slideshare.net/anisanwesley/angular-jumpstart-8-services

9 - Modulos
http://pt.slideshare.net/anisanwesley/angular-jumpstart-9-modulos

10 - Requests
http://pt.slideshare.net/anisanwesley/angular-jumpstart-10-requests

11 - Roteamento
http://pt.slideshare.net/anisanwesley/angular-jumpstart-11-roteamento

Publicada em: Software
  • Seja o primeiro a comentar

SPA Jumpstart - Angular - 1 - Introdução

  1. 1. AngularJS
  2. 2. Objetivo  Este guia tem como objetivo fornecer informações de acesso rápido para consultas de tópicos relacionados ao AngularJS, juntamente com padrões e recomendações de desenvolvimento de uma Web Application.
  3. 3. Ferramentas JSBin para testes em pequena escala Visual Studio quando envolver vários arquivos e testes em larga escala
  4. 4. Conceitos AngularJS Introdução • Open-source • Inteiramente executado no browser • Javascript • Mantido pela Google Procura abranger todas as áreas do desenvolvimento web • Ligações diretas de dados com HTML • Rotas intrusivas e intuitivas • Extensão do HTML padrão • Chamadas ao servidor
  5. 5. Conceitos AngularJS Model View “Whatever” • Não depende de MVVM ou MVC • Flexibilidade para estruturar como bem entender • Desde que aja relação entre model e view. Perigo! • Vários padrões de desenvolvimento • Nenhum sólido • Fizemos a “Receita de bolo”
  6. 6. Web Browser AngularJS ASP.NET Class Library Business App Index.html Module Directivies Routes Templates Views Controller ViewModel Services Factories Repository BreezeJS $resource $http WebAPI ApiController Services
  7. 7. Vamos ao código Hello World!  Referenciar angular.js  Declarar ng-app na tag root da aplicação  Usar como bem entender <!DOCTYPE html> <html ng-app> <head> <script src="angular.js"></script> </head> <body> {{"Hello"}} {{"World"+'!'}} 2+5={{2+5}} </body> </html>
  8. 8. Vamos ao código Two way data-binding  A declarativa ng-model faz menção à alguma propriedade do viewmodel <html ng-app> <head> <script src="angular.js"></script> </head> <body> <div> <input type="text" ng-model="firstName" /> <input type="text" ng-model="lastName" /> </div> {{firstName}} {{lastName}} tem {{(firstName+lastName).length}} letras. </body> </html>
  9. 9. Wesley A.Lemos Lages/SC - 2014

×