AngularJS - Hello World

Hello Classic World

Geralmente, quando estamos aprendendo a usar um novo idioma, a primeira coisa que fazemos é criar um pequeno programa que imprime o clássico para nós. "Olá mundo"Embora isso possa não ser de uso real em um aplicativo, tem várias implicações. Ele nos ensina a iniciar o idioma e nos dá uma maneira de verificar se tudo está funcionando corretamente.
Nesta seção, veremos como realizar um Olá mundo, além de visualizar e revisar os conceitos associados que nos permitem construir aplicativos em AngularJS.
Em AngularJS O template fica do lado do cliente, pois os dados chegam ao nosso aplicativo e é justamente nesta área que ele é organizado e preparado para seu consumo pelo usuário; ao aplicar este conceito a um aplicativo de página única e usando AJAX poderemos atingir o dinamismo sem a necessidade do usuário recarregar a web onde navega.
Para realizar um simples Olá mundo E sabendo do exposto, vamos ver o que precisamos para cumprir nosso objetivo:

• precisamos de HTML base onde incluímos dois arquivos. O primeiro será o AngularJS e o segundo é um script customizado onde nossa lógica de processamento irá.
• Dentro do HTML você tem que definir o bloco onde AngularJS vai ter influência, ou seja, onde vamos colocar o rótulo ng-app.
• Em nosso script personalizado, devemos criar um controlador AngularJS para passar o texto para nosso aplicativo.

Depois de saber o que precisamos, devemos construir o código correspondente, vamos ver na imagem a seguir como fizemos isso:

PROLONGAR

Vemos que incluímos AngularJS desde o Google CDN desta forma não temos que baixar os arquivos para o nosso projeto no momento, então ao invés de incluir um script customizado o que fizemos foi escrever as instruções de que precisamos, fazemos isso como uma demonstração, é sempre bom separar o código para que seja mais fácil de manusear.
Já o rótulo HTML tem a propriedade ng-app o que significa que AngularJS tem todo o documento como seu escopo e fazemos um div onde colocamos um ng-controlador que é um controlador AngularJS.
ImportanteTudo o que nosso controlador fará é imprimir a palavra Olá ao lado da palavra Mundo que já escrevemos anteriormente, destacamos como AngularJS não precisa de nada mais do que definirmos o variável de contexto e ele automaticamente faz os links correspondentes para nós.
Agora vamos ver como tudo isso se parece no navegador, abrimos o console firebug para mostrar o que aconteceu quando iniciamos nosso aplicativo:

PROLONGAR

Podemos então notar como AngularJS no momento de carregar o documento você colocou a palavra Olá em nosso div e desta forma o aplicativo funcionaria.
Como vemos, criamos nosso Olá mundo e entendemos um pouco mais como funciona AngularJS E o que queremos dizer quando falamos sobre o template estar no cliente, vamos imaginar que a palavra são dados que vêm de um serviço web, aqui vemos como isso ganha uma nova dimensão já que poderíamos gerar mais dinamismo em nossas aplicações.
Anteriorpagina 1 de 2PróximoGostou e ajudou este tutorial?Você pode recompensar o autor pressionando este botão para dar a ele um ponto positivo