AngularJS

Origem: Wikipédia, a enciclopédia livre.

Esta página ou secção cita fontes fiáveis e independentes, mas que não cobrem todo o conteúdo, o que compromete a verificabilidade(desde d
2017). Por favor, insira mais referências no texto. Material sem fontes poderá ser removido.
—Encontre fontes: Google (notícias, livros e acadêmico)

AngularJS

Paradigma Multi-paradigma: com base em protótipo

funcional
imperativo
scripts

Última versão 2.1.0 (12 de outubro de 2016)

Criado por Google Inc. e comunidade.

Licença: MIT

Página oficial angularjs.org

AngularJS é um framework JavaScript código aberto, mantido pelo Google, que auxilia na
execução de single-page applications. Seu objetivo é aumentar aplicativos que podem ser
acessados por um navegador web, foi construído sob o padrão model-view-view-model
(MVVM), em um esforço para facilitar tanto o desenvolvimento quanto o teste dos
aplicativos.
A biblioteca lê o HTML que contém atributos especiais e então executa a diretiva na qual
esta tag pertence, e faz a ligação entre a apresentação e seu modelo, representado por
variáveis JavaScript comuns. O valor dessas variáveis JavaScript podem ser setadas
manualmente, ou via um recurso JSON estático ou dinâmico.

Índice
[esconder]

 1A filosofia do Angular
o 1.1Objetivos
o 1.2AngularJS bootstrapper
o 1.3Principais diretivas do Angular
o 1.4Ligação bidirecional de dados (Two-way data binding)
 2Histórico de desenvolvimento
o 2.1Plugin para Google Chrome
 3Comparação - Backbone.js
 4Ver também
 5Referências
 6Bibliografia
 7Ligações externas

A filosofia do Angular[editar | editar código-fonte]

O AngularJS é construído sob a crença de que a programação declarativa é melhor do que
a programação imperativa quando se trata da construção de interfaces com o usuário e da
conexão de componentes software, enquanto a programação imperativa é excelente para
a escrita de regras de negócio.[1] O framework adapta e estende o HTML tradicional para
uma melhor experiência com conteúdo dinâmico, com a ligação direta e bidirecional dos
dados (two-way data-binding) que permite sincronização automática de models e views.
Como resultado, AngularJS abstrai a manipulação do DOM e melhora os testes.
Objetivos[editar | editar código-fonte]

 Abstrair a manipulação do DOM da lógica do aplicativo. Isto melhora os testes do

código.
 Considera os testes do aplicativo tão importantes quanto seu desenvolvimento. A
dificuldade do teste é diretamente afetada pela maneira como o código é estruturado.
 Abstrai o acoplamento entre o lado cliente e o lado servidor da aplicação. Isto permite
que o desenvolvimento do aplicativo evolua em ambos os lados, de forma paralela, e
permite o reuso de código.
 Guia os desenvolvedores através da construção de todo o aplicativo: desde o design
de Interface, passando pela escrita das regras de negócio, até chegar aos testes da
aplicação.
Angular segue o padrão MVC da engenharia de Software e encoraja o baixo acoplamento
entre apresentação, dados e componentes lógicos. Usando injeção de dependência,
Angular traz serviços comumente designados ao lado servidor da aplicação, como
controllers para os componentes visuais, para o lado cliente da aplicação.
Consequentemente, o peso do backend é radicalmente reduzido, levando à aplicações
muito mais leves.
AngularJS bootstrapper[editar | editar código-fonte]
Existem 3 fases do AngularJS bootstrapper que ocorrem após o carregamento completo
do DOM:

1. Criar um novo injetor

2. Serviço de compilação: Ele passa pelo DOM e localiza todas as diretivas, como:
"ng-app"
3. Link – a fase de linking anexa todas as diretivas ao escopo.
Principais diretivas do Angular[editar | editar código-fonte]
Diretivas no AngularJS permitem ao desenvolvedor especificar tags HTML personalizadas
e reusáveis, que personalizam o comportamento de certos elementos.

 ng-app – Declara um elemento como o elemento raiz da aplicação, ocasionando a

mudança do comportamento padrão da tag.
 ng-bind – Muda o texto de um elemento HTML automaticamente, de acordo com o seu
resultado, vindo das regras de negócio.
 ng-model – É similar ao ng-bind, mas permite ligação direta bidirecional (two-way data
binding ) entre a view e o escopo do aplicativo.
 ng-class – Permite atributos de classe serem carregados dinamicamente.
 ng-click – Permite instanciar o evento de click, semelhante ao onclick.
 ng-controller – Especifica um controller JavaScript para aquele HTML em questão.
 ng-repeat – Instancia um elemento por item de um array.
 ng-show e ng-hide – Mostra ou esconde um elemento HTML de acordo com o
resultado de uma expressão booleana.
 ng-switch – Instancia um template, em uma lista de escolhas, dependendo do valor
obtido pela expressão.
 ng-view – A diretiva base para manipulação de rotas, resolvendo um JSON antes de
renderizar os modelos acionados por controladores especificados.
 ng-if – Declaração básica de um 'if' que permite mostrar um elemento se a condição
for verdadeira.
Ligação bidirecional de dados (Two-way data binding)[editar | editar
código-fonte]
Ligação bidirecional de dados no AngularJS é sua principal característica e reduz a
quantidade de códigos escritos para mostrar os dados processados pelo servidor.
Templates são renderizados em HTML puro de acordo com os dados contidos em um
escopo definido na model. A variável $scope do Angular detecta mudanças no modelo e
modifica o HTML na view por meio de um controller. Da mesma forma, qualquer alteração
na view é refletida na model. Isso exclui a necessidade de manipular o DOM e facilita
o bootstrapping e rápida prototipação de aplicativos web.[2] Alguns comentaristas dizem
que a abordagem de data binding do AngularJS é muito mais simples que o uso de outras
bibliotecas, como Ember.js[3] ou Backbone.js.[4]

Histórico de desenvolvimento[editar | editar código-fonte]

AngularJS foi originalmente desenvolvido em 2009 por Miško Hevery e Adam Abrons como
um software por trás de um serviço de armazenamento JSON online, que teria preço
estimado por megabyte, para aplicações pré-construídas (easy-to-make) para as
empresas.Este empreendimento foi disponibilizado em "GetAngular.com", e teve alguns
inscritos, antes de os dois decidirem abandonar a ideia comercial e distribuir Angular como
uma framework open-source.
Abrons deixou o projeto, mas Hevery, que trabalha no Google continuou seu
desenvolvimento e manteve o framework em conjunto com alguns colegas do Google: Igor
Minár e Vojta Jína.
Plugin para Google Chrome[editar | editar código-fonte]
Em Julho de 2012, O time do Angular construiu um plugin para o Google Chrome chamado
Batarang,[5] que melhora o debug de aplicativos web construídos com Angular. A extensão
permite fácil detecção de gargalos e oferece uma Interface visual para depurar seus
aplicativos.[6]

Comparação - Backbone.js[editar | editar código-fonte]

Data-binding
O maior contraste entre estas duas bibliotecas é a maneira que models e views
são sincronizados. Enquanto AngularJS implementa two way data-binding, o
Backbone.js baseia-se fortemente em boilerplate code que harmoniza seus models
e views.[7]
REST
Backbone.js comunica bem com backends via RESTful. Um uso simples da API
REST é também disponível com AngularJS usando o serviço $resource. AngularJS
também provê um serviço $http que é mais flexível, connectando servidores
remotos através de um objeto XMLHttpRequest ou via JSONP .[8]
Templating
AngularJS usa uma combinação de tags HTML especiais e expressões.
Backbone.js usa mecanismos de templates diferentes, como Underscore.js.[7]

Ver também[editar | editar código-fonte]

 Backbone.js
 Ember.js
 Knockout (framework)
 Meteor (framework)
 Vue.js

Referências
1. Ir para cima↑ «What Is Angular?». Consultado em 18 de Maio de 2015
2. Ir para cima↑ «5 Awesome AngularJS Features». Consultado em 13 de
Fevereiro de 2013
3. Ir para cima↑ Cédric Beust (29 de dezembro de 2012). «Migrating from
Ember.js to AngularJS». Consultado em 1 de junho de 2013
4. Ir para cima↑ Joel Rosen (9 de abril de 2013). «Using AngularJS at
Localytics». Localytics. Consultado em 1 de junho de 2013
5. Ir para cima↑ Batarang homepage
6. Ir para cima↑ http://blog.angularjs.org/2012/07/introducing-angularjs-
batarang.html
7. ↑ Ir para:a b «Backbonejs vs Angularjs: Demystifying the myths». Consultado em
13 de Fevereiro de 2013
8. Ir para cima↑ «Javascript Frameworks And Data Binding». Consultado em 13
de Fevereiro de 2013

Bibliografia[editar | editar código-fonte]

 Green, Brad; Seshadri, Shyam (22 de março de 2013). AngularJS 1st ed.
[S.l.]: O'Reilly Media. p. 150. ISBN 978-1449344856

Ligações externas[editar | editar código-fonte]

 Website oficial (em inglês)
 AngularJS no GitHub
 Angular 2 (em inglês)
[Escond

v•e

Framework para a
 ASP.NET Dynamic Data
 ASP.NET MVC
 ASP.NET Web Forms
 BFC
ASP.NET
 DotNetNuke
 MonoRail
 OpenRasta
 Umbraco
 CFWheels
 ColdBox Platform
 ColdSpring
ColdFusion
 Fusebox
 Mach-II
 Model-Glue
 CL-HTTP
 UnCommon Web
Common Lisp
 Weblocks
 CppCMS
C++
  Wt
 Happstack
 Yesod
Haskell
 Snap
 AppFuse
 Flexive
 Grails
 GWT
 ICEfaces
 ItsNat
 JavaServer Faces
 Jspx
 Juzu
 Makumba
 OpenXava
 Play

Java Reasonable Server Faces
 Remote Application Platform
 RIFE
 Seam
 Spring
 Stripes
 Struts
 Tapestry
 Vaadin
 WebWork
 Wicket
 WaveMaker
 ZK
 Ample SDK
 AngularJS
 Backbone.js
 Chaplin.js
 Closure
 Dojo Toolkit
 Ember.js
 Ext JS
JavaScript
 jQuery
 Meteor
 Prototype
 Rico
 script.aculo.us
 Sencha Touch
 SproutCore
 Wakanda
 Catalyst
 Dancer
 Mason
Perl
 Maypole
 Mojolicious
 WebGUI
 AppFlower
 CakePHP

PHP CodeIgniter
 Drupal
 eZ Publish
  Fat-Free
 FuelPHP
 Horde
 Joomla!
 Kohana
 Laravel
 Lithium
 Midgard
 MODX
 Nette Framework
 Phalcon
 PRADO
 Qcodo
 Seagull
 SilverStripe
 Symfony
 TYPO3
 WordPress
 Xaraya
 XOOPS
 Yii
 Zend Framework
 BlueBream
 CherryPy
 Django
 Flask
 Grok
 Nevow
 Pyjamas
 Pylons
Python
 Pyramid
 Quixote
 TACTIC
 Tornado
 TurboGears
 web2py
 Webware
 Zope 2
 Camping
 Hobo
 Merb
 Padrino

Ruby Ramaze
 RailsBricks
 Ruby on Rails
 Sinatra
 Hanami
 Lift
 Play
Scala
 Scalatra
 AIDA/Web
Smalltalk
 Seaside
 Application Express (PL/SQL)
 Grails (Groovy)
Outras Linguagens
 Kepler (Lua)
 OpenACS (Tcl)
  SproutCore (JavaScript/Ruby)
 SymbolicWeb (Clojure)
 Yaws (Erlang)
Categorias:
 JavaScript
 Linguagens de script
 Web
 Software de 2009
 Bibliotecas JavaScript
 Software usando a licença MIT
 Google
 Serviços da Google