Agrega paso 5 a la aplicación

- Reemplaza los datos en memoria por datos cargados desde el servidor
(en
  forma de archivo estático `phones.json`).

  - El archivo `phones.json` se carga utilizando el servicio `$http`.

- Demuestra el uso de [servicios][service] e [inyección de
dependencias][DI].

  - El servicio [$http] se inyecta en el controlador a través la
[inyección de dependencias][DI].

app/js/controladores.js

@@ -4,18 +4,11 @@
 
 var phonecatAp = angular.module('phonecatAp', []);
 
-phonecatAp.controller('ListaTelefonosCtrl', function($scope) {
-  $scope.telefonos = [
-    {'name': 'Nexus S',
-      'snippet': 'Fast just got faster with Nexus S.',
-      'age': 1},
-    {'name': 'Motorola XOOM™ with Wi-Fi',
-      'snippet': 'The Next, Next Generation tablet with Wi-Fi.',
-      'age': 2},
-    {'name': 'MOTOROLA XOOM™',
-      'snippet': 'The Next, Next Generation tablet.',
-      'age': 3}
-  ];
+phonecatAp.controller('ListaTelefonosCtrl', function($scope, $http) {
+  $http.get('phones/phones.json').success(function(data) {
+    $scope.telefonos = data;
+  });
+
 
   $scope.ordenProp = 'age';
 

app/phones/phones.json

@@ -4,14 +4,14 @@
         "id": "motorola-xoom-with-wi-fi", 
         "imageUrl": "img/phones/motorola-xoom-with-wi-fi.0.jpg", 
         "name": "Motorola XOOM\u2122 with Wi-Fi", 
-        "snippet": "The Next, Next Generation\r\n\r\nExperience the future with Motorola XOOM with Wi-Fi, the world's first tablet powered by Android 3.0 (Honeycomb)."
+        "snippet": "The Next, Next Generation tablet with Wi-Fi."
     }, 
     {
         "age": 1, 
         "id": "motorola-xoom", 
         "imageUrl": "img/phones/motorola-xoom.0.jpg", 
         "name": "MOTOROLA XOOM\u2122", 
-        "snippet": "The Next, Next Generation\n\nExperience the future with MOTOROLA XOOM, the world's first tablet powered by Android 3.0 (Honeycomb)."
+        "snippet": "The Next, Next Generation tablet."
     }, 
     {
         "age": 2, 

test/e2e/scenarios.js

@@ -13,14 +13,14 @@ describe('mi ap', function() {
     var listaTelefonos = element.all(by.repeater('telefono in telefonos'));
     var query = element(by.model('query'));
 
-    expect(listaTelefonos.count()).toBe(3);
+    expect(listaTelefonos.count()).toBe(20);
 
     query.sendKeys('nexus');
     expect(listaTelefonos.count()).toBe(1);
 
     query.clear();
     query.sendKeys('motorola');
-    expect(listaTelefonos.count()).toBe(2);
+    expect(listaTelefonos.count()).toBe(8);
   });
 
   it('Debe ser posible controlar el orden de los teléfonos via el combo box', function() {

test/unit/controladoresSpec.js

@@ -3,19 +3,26 @@
 /* jasmine specs for controllers go here */
 
 describe('controllers', function() {
-  var scope, ctrl;
+  var scope, ctrl, $httpBackend;
 
   beforeEach(module('phonecatAp'));
+  beforeEach(inject(function(_$httpBackend_, $rootScope, $controller) {
+    $httpBackend = _$httpBackend_;
+    $httpBackend.expectGET('phones/phones.json').
+      respond([{name: 'Nexus S'}, {name: 'Motorola DROID'}]);
 
-
-  beforeEach(inject(function($controller) {
-    scope = {};
-    ctrl = $controller('ListaTelefonosCtrl', {$scope:scope});
+    scope = $rootScope.$new();
+    ctrl = $controller('ListaTelefonosCtrl', {$scope: scope});
   }));
 
-  it('debe crear el modelo "telefonos" con 3 teléfonos', inject(function($controller) {
-    expect(scope.telefonos.length).toBe(3);
-  }));
+
+  it('debe crear el modelo "telefonos" con 2 teléfonos traidos de xhr', function() {
+    expect(scope.telefonos).toBeUndefined();
+    $httpBackend.flush();
+
+    expect(scope.telefonos).toEqual([{name: 'Nexus S'},
+      {name: 'Motorola DROID'}]);
+  });
 
 
   it('debe setear el valor por defecto del modelo ordenProp', function() {