Powered by Max Banner Ads 

Série Ionic:Integrando Ionic com sua app AngularJS

June 16th, 2015 No comments

ionic-angular-opti

Olá Pessoal,

Vamos ver da forma mais simples como é fácil fazer uma integração com o back-end usando ionic + angularjs. Vou considerar que vc já sabe como criar uma app no ionic. Para o exemplo aqui vou usar o template sidemenu do ionic.

lets go…

Passo 1

Crie um projeto sidemenu do ionic

Passo 2
Vamos criar o controller e dizer pra ele chamar o serviço web, ou seja, nossa api. Lembre-se de ter o serviço rodando.
No arquivo controllers.js gerado pelo ionic que já vem no template adicione, após o controller já gerado:

 

Passo 3
Considerando que vc manteve os nomes que veio no template, no arquivo playlits adicione:

O código completo ficando assim:

 

Passo 4

Vamos testar, basta digitar:

Para testarmos no browser

Passo 5
Observe que me retornou o valor do saldo da conta de um serviço que possuo:

 

ionicappcamilo

Vale lembrar que o objetivo aqui é mostrar a integração e funcionamento. O ideal é que você tenha um Service do lado do angularJS usando um factory do ngResource. Manter os controllers separados dos services e cada um com suas responsabilidades é uma boa prática. Em breve faço um post usando o ngResouce.

O projeto está no meu github.com/camilolopes

https://github.com/camilolopes/workspaceAngularJs
Espero que tenham gostado, simples demais né?

abraço, see ya!!

Série Ionic:Instalando Ionic no Windows 7

June 8th, 2015 No comments

ionic-angular-opti

Olá Pessoal,

Tenho iniciado projetos na area de mobile. E para começar estamos com um projeto ionic + angularjs. Como já usamos angularJs aqui em todos os projetos adicionar o Ionic, nossa nem sentirmos o impacto. Isso é muito bom, para quem já é desenvolvedor AngularJS.

lets go…

Starting…

Vamos fazer as coisas da maneira mais simples possível.Quem usa Windows, vai sempre sofrer qdo precisa instalar algum modulo NPM sempre acontece alguma zica. Para quem usa Linux dificilmente terá problemas.

Vou considerar que você já tem o NodeJS instalado. Se não tive, faça a instalação.

Passo 1
No caso do windows eu uso o Git Bash para executar comandos linux. Também vou considerar que tenha o gitbash instalado.

Passo 2

Crie uma pasta algo como ionic e em seguida entre na pasta

Passo 3

No gitbash digite npm update -g e aguarde por minutos que depender da sua conexão vai demorar bastante.

Passo 4
Após terminar o update vamos instalar o cordova

Passo 5

Agora o ionic

Passo 6

Se tudo deu certo vamos criar uma app simples

sidemenu é o template que queremos usar

Passo 7
entre na pasta myapp e digite

Assim vamos testar app no browser. No chrome eu uso um pluggin chamado ripple que permite testar com interface mobile.

 

ionicappcamilo

Pronto criamos uma app com ionic, e agora é só modificar. Basta verificar na documentação e veja como é simples fazer alterações.

abraços,

See ya!!

Related Posts with Thumbnails
Tags: