Angularjs - Обновление переменной области действия после операции AJAX

Question

var foo = angular.module('foo', []); 

foo.factory('apiService', function($http){ 
    'use strict'; 

    return { 
     getItems: function() { 
      return $http.get('api/get-items') 
       .then(function(result) { 
        return result; 
       }); 
     } 
    }; 
}); 

OutlastApp.controller('ItemListCtrl', function ($scope, apiService) { 
    'use strict'; 

    apiService.getItems().then(function(result) { 
     $scope.items = result.data; 
    }); 
}); 

OutlastApp.controller('AddItemCtrl', function ($scope, $http, $rootScope, apiService) { 
    'use strict'; 

    ... 

    $scope.saveItem = function(item) { 
     $http({ 
      url: 'api/add-item', 
      method: 'GET', 
      params: { 
       name: item.name, 
       description: item.description, 
       ... 
      } 
     }).success(function(data, status, headers, config) { 
      // TODO: What to do? 
     }); 
    }; 
}); 

Как вы, кажется, у меня есть установка $scope.items, чтобы получить его содержимое от вызова AJAX.

Что я пытаюсь сделать, так это то, что я хочу попытаться обновить $scope.items, чтобы он отражал недавно добавленный элемент.

Как это сделать? Правильно ли это сделать двустороннюю привязку между API и переменными области видимости?

Answer 1

Учитывая то, что я вижу здесь, вам нужно, вероятно, поделиться коллекцией «предметы» между двумя контроллерами. Для того чтобы сделать это, вы можете использовать завод для хранения коллекции пунктов (приблизительно):

app.factory('SharedDataService', function() { 
    return { 
     items: [] 
    }; 
}); 

После создания этого вы можете использовать впрыскивать его в обоих контроллерах и «пунктов» объект будет разделяемых между ними , Затем вы можете просто нажимать новый элемент после его сохранения:

$http({ 
    // run your call here 
}).success(function(data, status, headers, config) { 
    // Here is where you push the new/saved item into the shared data: 
    SharedDataService.items.push(item); 
}); 

Это должно на самом деле это сделать. Удачи!

Видеоурок - Если вы еще не видели эту концепцию раньше - на данный момент - у Джона Линдквиста есть отличный video tutorial here.