Your SlideShare is downloading. ×
0
Criando serviços com AngularJS
Criando serviços com AngularJS
Criando serviços com AngularJS
Criando serviços com AngularJS
Criando serviços com AngularJS
Criando serviços com AngularJS
Criando serviços com AngularJS
Criando serviços com AngularJS
Criando serviços com AngularJS
Criando serviços com AngularJS
Criando serviços com AngularJS
Criando serviços com AngularJS
Criando serviços com AngularJS
Criando serviços com AngularJS
Criando serviços com AngularJS
Criando serviços com AngularJS
Criando serviços com AngularJS
Criando serviços com AngularJS
Criando serviços com AngularJS
Criando serviços com AngularJS
Criando serviços com AngularJS
Criando serviços com AngularJS
Criando serviços com AngularJS
Criando serviços com AngularJS
Criando serviços com AngularJS
Criando serviços com AngularJS
Criando serviços com AngularJS
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Criando serviços com AngularJS

4,506

Published on

Aprenda a criar serviços com AngularJS

Aprenda a criar serviços com AngularJS

Published in: Technology
0 Comments
6 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
4,506
On Slideshare
0
From Embeds
0
Number of Embeds
8
Actions
Shares
0
Downloads
0
Comments
0
Likes
6
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Criando Serviços com AngularJS Rodrigo Branas – @rodrigobranas - http://www.agilecode.com.br
  • 2. Rodrigo Branas rodrigo.branas@agilecode.com.br http://www.agilecode.com.br • Desenvolvendo Software na Gennera • Criando treinamentos na Agile Code • Escrevendo na Java Magazine e PacktPub • Palestrando sobre desenvolvimento de software em eventos, universidades e empresas
  • 3. Certificações Formação Acadêmica Ciências da Computação – UFSC Gerenciamento de Projetos - FGV SCJA, SCJP, SCJD, SCWCD, SCBCD, PMP, MCP e CSM Experiência Há mais de 12 anos desenvolvendo software na plataforma Java com as empresas: EDS, HP, NET, Citibank, GM, Dígitro, Softplan, OnCast, Senai, VALE, RBS, Unimed, Globalcode, V.Office, Suntech, WPlex e Gennera.
  • 4. • Há mais de 5 anos liderando pessoas. • Mais de 2000 horas em sala de aula. • Mais de 100 apresentações em eventos. • 6 artigos escritos para revistas. • 1 livro. • Mais de 500 profissionais treinados. • Criação de 22 palestras. • Criação de 10 treinamentos. • Criação de mais de 3.000 slides. O que realmente me motiva?
  • 5. Quando devemos criar serviços?
  • 6. Criando um serviço para interagir com a API REST
  • 7. 1. var app = angular.module("listaTelefonica", ['ngRoute']); 2. 3. app.controller("ListaTelefonicaCtrl", function ($scope, $http) { 4. $scope.app = "Lista Telefônica"; 5. $scope.carregarContatos = function () { 6. $http.get('/contatos').success(function (contatos) { 7. $scope.listaTelefonica = contatos; 8. }); 9. }; 10. $scope.carregarOperadoras = function () { 11. $http.get('/operadoras').success(function (operadoras) { 12. $scope.operadoras = operadoras; 13. }); 14. }; 15. $scope.adicionarContato = function (contato) { 16. $http.post('/contatos', contato).success(function () { 17. $scope.carregarContatos(); 18. }); 19. delete $scope.contato; 20. }; 21. $scope.carregarContatos(); 22. $scope.carregarOperadoras(); 23. });
  • 8. 1. var app = angular.module("listaTelefonica", ['ngRoute']); 2. 3. app.controller("ListaTelefonicaCtrl", function ($scope, $http) { 4. $scope.app = "Lista Telefônica"; 5. $scope.carregarContatos = function () { 6. $http.get('/contatos').success(function (contatos) { 7. $scope.listaTelefonica = contatos; 8. }); 9. }; 10. $scope.carregarOperadoras = function () { 11. $http.get('/operadoras').success(function (operadoras) { 12. $scope.operadoras = operadoras; 13. }); 14. }; 15. $scope.adicionarContato = function (contato) { 16. $http.post('/contatos', contato).success(function () { 17. $scope.carregarContatos(); 18. }); 19. delete $scope.contato; 20. }; 21. $scope.carregarContatos(); 22. $scope.carregarOperadoras(); 23. });
  • 9. 1. var app = angular.module("listaTelefonica", ['ngRoute']); 2. 3. app.controller("ListaTelefonicaCtrl", function ($scope, $http) { 4. $scope.app = "Lista Telefônica"; 5. $scope.carregarContatos = function () { 6. $http.get('/contatos').success(function (contatos) { 7. $scope.listaTelefonica = contatos; 8. }); 9. }; 10. $scope.carregarOperadoras = function () { 11. $http.get('/operadoras').success(function (operadoras) { 12. $scope.operadoras = operadoras; 13. }); 14. }; 15. $scope.adicionarContato = function (contato) { 16. $http.post('/contatos', contato).success(function () { 17. $scope.carregarContatos(); 18. }); 19. delete $scope.contato; 20. }; 21. $scope.carregarContatos(); 22. $scope.carregarOperadoras(); 23. });
  • 10. factory
  • 11. 1. var app = angular.module("listaTelefonica", ['ngRoute']); 2. 3. app.controller("ListaTelefonicaCtrl", function ($scope, $http) { 4. $scope.app = "Lista Telefônica"; 5. $scope.carregarContatos = function () { 6. $http.get('/contatos').success(function (contatos) { 7. $scope.listaTelefonica = contatos; 8. }); 9. }; 10. $scope.carregarOperadoras = function () { 11. $http.get('/operadoras').success(function (operadoras) { 12. $scope.operadoras = operadoras; 13. }); 14. }; 15. $scope.adicionarContato = function (contato) { 16. $http.post('/contatos', contato).success(function () { 17. $scope.carregarContatos(); 18. }); 19. delete $scope.contato; 20. }; 21. $scope.carregarContatos(); 22. $scope.carregarOperadoras(); 23. });
  • 12. 1. var app = angular.module("listaTelefonica", ['ngRoute']); 2. 3. app.controller("ListaTelefonicaCtrl", function ($scope, $http) { 4. $scope.app = "Lista Telefônica"; 5. $scope.carregarContatos = function () { 6. $http.get('/contatos').success(function (contatos) { 7. $scope.listaTelefonica = contatos; 8. }); 9. }; 10. $scope.carregarOperadoras = function () { 11. $http.get('/operadoras').success(function (operadoras) { 12. $scope.operadoras = operadoras; 13. }); 14. }; 15. $scope.adicionarContato = function (contato) { 16. $http.post('/contatos', contato).success(function () { 17. $scope.carregarContatos(); 18. }); 19. delete $scope.contato; 20. }; 21. $scope.carregarContatos(); 22. $scope.carregarOperadoras(); 23. }); 24. 25. app.factory();
  • 13. 1. var app = angular.module("listaTelefonica", ['ngRoute']); 2. 3. app.controller("ListaTelefonicaCtrl", function ($scope, $http) { 4. $scope.app = "Lista Telefônica"; 5. $scope.carregarContatos = function () { 6. $http.get('/contatos').success(function (contatos) { 7. $scope.listaTelefonica = contatos; 8. }); 9. }; 10. $scope.carregarOperadoras = function () { 11. $http.get('/operadoras').success(function (operadoras) { 12. $scope.operadoras = operadoras; 13. }); 14. }; 15. $scope.adicionarContato = function (contato) { 16. $http.post('/contatos', contato).success(function () { 17. $scope.carregarContatos(); 18. }); 19. delete $scope.contato; 20. }; 21. $scope.carregarContatos(); 22. $scope.carregarOperadoras(); 23. }); 24. 25. app.factory("ListaTelefonicaAPI");
  • 14. 1. var app = angular.module("listaTelefonica", ['ngRoute']); 2. 3. app.controller("ListaTelefonicaCtrl", function ($scope, $http) { 4. $scope.app = "Lista Telefônica"; 5. $scope.carregarContatos = function () { 6. $http.get('/contatos').success(function (contatos) { 7. $scope.listaTelefonica = contatos; 8. }); 9. }; 10. $scope.carregarOperadoras = function () { 11. $http.get('/operadoras').success(function (operadoras) { 12. $scope.operadoras = operadoras; 13. }); 14. }; 15. $scope.adicionarContato = function (contato) { 16. $http.post('/contatos', contato).success(function () { 17. $scope.carregarContatos(); 18. }); 19. delete $scope.contato; 20. }; 21. $scope.carregarContatos(); 22. $scope.carregarOperadoras(); 23. }); 24. 25. app.factory("ListaTelefonicaAPI", function () { 26. });
  • 15. 1. var app = angular.module("listaTelefonica", ['ngRoute']); 2. 3. app.controller("ListaTelefonicaCtrl", function ($scope, $http) { 4. $scope.app = "Lista Telefônica"; 5. $scope.carregarContatos = function () { 6. $http.get('/contatos').success(function (contatos) { 7. $scope.listaTelefonica = contatos; 8. }); 9. }; 10. $scope.carregarOperadoras = function () { 11. $http.get('/operadoras').success(function (operadoras) { 12. $scope.operadoras = operadoras; 13. }); 14. }; 15. $scope.adicionarContato = function (contato) { 16. $http.post('/contatos', contato).success(function () { 17. $scope.carregarContatos(); 18. }); 19. delete $scope.contato; 20. }; 21. $scope.carregarContatos(); 22. $scope.carregarOperadoras(); 23. }); 24. 25. app.factory("ListaTelefonicaAPI", function ($http) { 26. });
  • 16. 1. var app = angular.module("listaTelefonica", ['ngRoute']); 2. 3. app.controller("ListaTelefonicaCtrl", function ($scope, $http) { 4. $scope.app = "Lista Telefônica"; 5. $scope.carregarContatos = function () { 6. $http.get('/contatos').success(function (contatos) { 7. $scope.listaTelefonica = contatos; 8. }); 9. }; 10. $scope.carregarOperadoras = function () { 11. $http.get('/operadoras').success(function (operadoras) { 12. $scope.operadoras = operadoras; 13. }); 14. }; 15. $scope.adicionarContato = function (contato) { 16. $http.post('/contatos', contato).success(function () { 17. $scope.carregarContatos(); 18. }); 19. delete $scope.contato; 20. }; 21. $scope.carregarContatos(); 22. $scope.carregarOperadoras(); 23. }); 24. 25. app.factory("ListaTelefonicaAPI", function ($http) { 26. var _getContatos = function () { 27. }; 28. });
  • 17. 1. var app = angular.module("listaTelefonica", ['ngRoute']); 2. 3. app.controller("ListaTelefonicaCtrl", function ($scope, $http) { 4. $scope.app = "Lista Telefônica"; 5. $scope.carregarContatos = function () { 6. $http.get('/contatos').success(function (contatos) { 7. $scope.listaTelefonica = contatos; 8. }); 9. }; 10. $scope.carregarOperadoras = function () { 11. $http.get('/operadoras').success(function (operadoras) { 12. $scope.operadoras = operadoras; 13. }); 14. }; 15. $scope.adicionarContato = function (contato) { 16. $http.post('/contatos', contato).success(function () { 17. $scope.carregarContatos(); 18. }); 19. delete $scope.contato; 20. }; 21. $scope.carregarContatos(); 22. $scope.carregarOperadoras(); 23. }); 24. 25. app.factory("ListaTelefonicaAPI", function ($http) { 26. var _getContatos = function () { 27. return $http.get('/contatos'); 28. }; 29. });
  • 18. 1. var app = angular.module("listaTelefonica", ['ngRoute']); 2. 3. app.controller("ListaTelefonicaCtrl", function ($scope, $http) { 4. $scope.app = "Lista Telefônica"; 5. $scope.carregarContatos = function () { 6. $http.get('/contatos').success(function (contatos) { 7. $scope.listaTelefonica = contatos; 8. }); 9. }; 10. $scope.carregarOperadoras = function () { 11. $http.get('/operadoras').success(function (operadoras) { 12. $scope.operadoras = operadoras; 13. }); 14. }; 15. $scope.adicionarContato = function (contato) { 16. $http.post('/contatos', contato).success(function () { 17. $scope.carregarContatos(); 18. }); 19. delete $scope.contato; 20. }; 21. $scope.carregarContatos(); 22. $scope.carregarOperadoras(); 23. }); 24. 25. app.factory("ListaTelefonicaAPI", function ($http) { 26. var _getContatos = function () { 27. return $http.get('/contatos'); 28. }; 29. return { 30. }; 31. });
  • 19. 1. var app = angular.module("listaTelefonica", ['ngRoute']); 2. 3. app.controller("ListaTelefonicaCtrl", function ($scope, $http) { 4. $scope.app = "Lista Telefônica"; 5. $scope.carregarContatos = function () { 6. $http.get('/contatos').success(function (contatos) { 7. $scope.listaTelefonica = contatos; 8. }); 9. }; 10. $scope.carregarOperadoras = function () { 11. $http.get('/operadoras').success(function (operadoras) { 12. $scope.operadoras = operadoras; 13. }); 14. }; 15. $scope.adicionarContato = function (contato) { 16. $http.post('/contatos', contato).success(function () { 17. $scope.carregarContatos(); 18. }); 19. delete $scope.contato; 20. }; 21. $scope.carregarContatos(); 22. $scope.carregarOperadoras(); 23. }); 24. 25. app.factory("ListaTelefonicaAPI", function ($http) { 26. var _getContatos = function () { 27. return $http.get('/contatos'); 28. }; 29. return { 30. getContatos: _getContatos 31. }; 32. });
  • 20. 1. var app = angular.module("listaTelefonica", ['ngRoute']); 2. 3. app.controller("ListaTelefonicaCtrl", function ($scope, $http) { 4. $scope.app = "Lista Telefônica"; 5. $scope.carregarContatos = function () { 6. $http.get('/contatos').success(function (contatos) { 7. $scope.listaTelefonica = contatos; 8. }); 9. }; 10. $scope.carregarOperadoras = function () { 11. $http.get('/operadoras').success(function (operadoras) { 12. $scope.operadoras = operadoras; 13. }); 14. }; 15. $scope.adicionarContato = function (contato) { 16. $http.post('/contatos', contato).success(function () { 17. $scope.carregarContatos(); 18. }); 19. delete $scope.contato; 20. }; 21. $scope.carregarContatos(); 22. $scope.carregarOperadoras(); 23. }); 24. 25. app.factory("ListaTelefonicaAPI", function ($http) { 26. var _getContatos = function () { 27. return $http.get('/contatos'); 28. }; 29. return { 30. getContatos: _getContatos 31. }; 32. });
  • 21. 1. var app = angular.module("listaTelefonica", ['ngRoute']); 2. 3. app.controller("ListaTelefonicaCtrl", function ($scope, $http, ListaTelefonicaAPI) { 4. $scope.app = "Lista Telefônica"; 5. $scope.carregarContatos = function () { 6. $http.get('/contatos').success(function (contatos) { 7. $scope.listaTelefonica = contatos; 8. }); 9. }; 10. $scope.carregarOperadoras = function () { 11. $http.get('/operadoras').success(function (operadoras) { 12. $scope.operadoras = operadoras; 13. }); 14. }; 15. $scope.adicionarContato = function (contato) { 16. $http.post('/contatos', contato).success(function () { 17. $scope.carregarContatos(); 18. }); 19. delete $scope.contato; 20. }; 21. $scope.carregarContatos(); 22. $scope.carregarOperadoras(); 23. }); 24. 25. app.factory("ListaTelefonicaAPI", function ($http) { 26. var _getContatos = function () { 27. return $http.get('/contatos'); 28. }; 29. return { 30. getContatos: _getContatos 31. }; 32. });
  • 22. 1. var app = angular.module("listaTelefonica", ['ngRoute']); 2. 3. app.controller("ListaTelefonicaCtrl", function ($scope, $http, ListaTelefonicaAPI) { 4. $scope.app = "Lista Telefônica"; 5. $scope.carregarContatos = function () { 6. $http.get('/contatos').success(function (contatos) { 7. $scope.listaTelefonica = contatos; 8. }); 9. }; 10. $scope.carregarOperadoras = function () { 11. $http.get('/operadoras').success(function (operadoras) { 12. $scope.operadoras = operadoras; 13. }); 14. }; 15. $scope.adicionarContato = function (contato) { 16. $http.post('/contatos', contato).success(function () { 17. $scope.carregarContatos(); 18. }); 19. delete $scope.contato; 20. }; 21. $scope.carregarContatos(); 22. $scope.carregarOperadoras(); 23. }); 24. 25. app.factory("ListaTelefonicaAPI", function ($http) { 26. var _getContatos = function () { 27. return $http.get('/contatos'); 28. }; 29. return { 30. getContatos: _getContatos 31. }; 32. });
  • 23. 1. var app = angular.module("listaTelefonica", ['ngRoute']); 2. 3. app.controller("ListaTelefonicaCtrl", function ($scope, $http, ListaTelefonicaAPI) { 4. $scope.app = "Lista Telefônica"; 5. $scope.carregarContatos = function () { 6. $http.get('/contatos').success(function (contatos) { 7. $scope.listaTelefonica = contatos; 8. }); 9. }; 10. $scope.carregarOperadoras = function () { 11. $http.get('/operadoras').success(function (operadoras) { 12. $scope.operadoras = operadoras; 13. }); 14. }; 15. $scope.adicionarContato = function (contato) { 16. $http.post('/contatos', contato).success(function () { 17. $scope.carregarContatos(); 18. }); 19. delete $scope.contato; 20. }; 21. $scope.carregarContatos(); 22. $scope.carregarOperadoras(); 23. }); 24. 25. app.factory("ListaTelefonicaAPI", function ($http) { 26. var _getContatos = function () { 27. return $http.get('/contatos'); 28. }; 29. return { 30. getContatos: _getContatos 31. }; 32. });
  • 24. 1. var app = angular.module("listaTelefonica", ['ngRoute']); 2. 3. app.controller("ListaTelefonicaCtrl", function ($scope, $http, ListaTelefonicaAPI) { 4. $scope.app = "Lista Telefônica"; 5. $scope.carregarContatos = function () { 6. .success(function (contatos) { 7. $scope.listaTelefonica = contatos; 8. }); 9. }; 10. $scope.carregarOperadoras = function () { 11. $http.get('/operadoras').success(function (operadoras) { 12. $scope.operadoras = operadoras; 13. }); 14. }; 15. $scope.adicionarContato = function (contato) { 16. $http.post('/contatos', contato).success(function () { 17. $scope.carregarContatos(); 18. }); 19. delete $scope.contato; 20. }; 21. $scope.carregarContatos(); 22. $scope.carregarOperadoras(); 23. }); 24. 25. app.factory("ListaTelefonicaAPI", function ($http) { 26. var _getContatos = function () { 27. return $http.get('/contatos'); 28. }; 29. return { 30. getContatos: _getContatos 31. }; 32. });
  • 25. 1. var app = angular.module("listaTelefonica", ['ngRoute']); 2. 3. app.controller("ListaTelefonicaCtrl", function ($scope, $http, ListaTelefonicaAPI) { 4. $scope.app = "Lista Telefônica"; 5. $scope.carregarContatos = function () { 6. ListaTelefonicaAPI.getContatos().success(function (contatos) { 7. $scope.listaTelefonica = contatos; 8. }); 9. }; 10. $scope.carregarOperadoras = function () { 11. $http.get('/operadoras').success(function (operadoras) { 12. $scope.operadoras = operadoras; 13. }); 14. }; 15. $scope.adicionarContato = function (contato) { 16. $http.post('/contatos', contato).success(function () { 17. $scope.carregarContatos(); 18. }); 19. delete $scope.contato; 20. }; 21. $scope.carregarContatos(); 22. $scope.carregarOperadoras(); 23. }); 24. 25. app.factory("ListaTelefonicaAPI", function ($http) { 26. var _getContatos = function () { 27. return $http.get('/contatos'); 28. }; 29. return { 30. getContatos: _getContatos 31. }; 32. });
  • 26. 1. var app = angular.module("listaTelefonica", ['ngRoute']); 2. 3. app.controller("ListaTelefonicaCtrl", function ($scope, $http, ListaTelefonicaAPI) { 4. $scope.app = "Lista Telefônica"; 5. $scope.carregarContatos = function () { 6. ListaTelefonicaAPI.getContatos().success(function (contatos) { 7. $scope.listaTelefonica = contatos; 8. }); 9. }; 10. $scope.carregarOperadoras = function () { 11. $http.get('/operadoras').success(function (operadoras) { 12. $scope.operadoras = operadoras; 13. }); 14. }; 15. $scope.adicionarContato = function (contato) { 16. $http.post('/contatos', contato).success(function () { 17. $scope.carregarContatos(); 18. }); 19. delete $scope.contato; 20. }; 21. $scope.carregarContatos(); 22. $scope.carregarOperadoras(); 23. }); 24. 25. app.factory("ListaTelefonicaAPI", function ($http) { 26. var _getContatos = function () { 27. return $http.get('/contatos'); 28. }; 29. return { 30. getContatos: _getContatos 31. }; 32. });
  • 27. 1. var app = angular.module("listaTelefonica", ['ngRoute']); 2. 3. app.controller("ListaTelefonicaCtrl", function ($scope, $http, ListaTelefonicaAPI) { 4. $scope.app = "Lista Telefônica"; 5. $scope.carregarContatos = function () { 6. ListaTelefonicaAPI.getContatos().success(function (contatos) { 7. $scope.listaTelefonica = contatos; 8. }); 9. }; 10. $scope.carregarOperadoras = function () { 11. $http.get('/operadoras').success(function (operadoras) { 12. $scope.operadoras = operadoras; 13. }); 14. }; 15. $scope.adicionarContato = function (contato) { 16. $http.post('/contatos', contato).success(function () { 17. $scope.carregarContatos(); 18. }); 19. delete $scope.contato; 20. }; 21. $scope.carregarContatos(); 22. $scope.carregarOperadoras(); 23. }); 24. 25. app.service("ListaTelefonicaAPI", function ($http) { 26. this.getContatos = function () { 27. return $http.get('/contatos'); 28. }; 29. });

×