使用錯誤的「this」範圍的AngularJS服務http成功功能

Question

$http.put的成功功能無法訪問其在內部調用的服務的範圍this。我需要更新PUT請求回調中的服務屬性。

這是我想要的服務做了削減例如：

var myApp = angular.module('myApp', function($routeProvider) { 
// route provider stuff 
}).service('CatalogueService', function($rootScope, $http) { 
    // create an array as part of my catalogue 
    this.items = []; 

    // make a call to get some data for the catalogue 
    this.add = function(id) { 
     $http.put(
      $rootScope.apiURL, 
      {id:id} 
     ).success(function(data,status,headers,config) { 
      // on success push the data to the catalogue 
      // when I try to access "this" - it treats it as the window 
      this.items.push(data); 
     }).success(function(data,status,headers,config) { 
      alert(data); 
     }); 
    } 
} 

很抱歉，如果有在JS的一些錯誤，主要的一點是怎樣訪問服務範圍從成功回調裏面？

編輯：而這個問題的答案是正確的，我切換到factory方法既Josh和馬克推薦它

Answer 1

創建了一個變量（通常稱爲that）封閉分配給this讓你的回調函數將有你的服務對象訪問：

app.service('CatalogueService', function($rootScope, $http) { 
    var that = this; 
    ... 
     ).success(function(data,status,headers,config) { 
      that.items.push(data); 

下面是一個使用$超時而不是Plunker $ http來演示。

Answer 2

據我所知，你不能。但我不會試圖以這種方式運行服務。這裏是一個更清潔的方式：

.factory('CatalogueService', function($rootScope, $http) { 
    // We first define a private API for our service. 

    // Private vars. 
    var items = []; 

    // Private methods. 
    function add(id) { 
    $http.put($rootScope.apiURL, {id:id}) 
    .success(function(data,status,headers,config) { items.push(data); }) 
    .then(function(response) { console.log(response.data); }); 
    } 

    function store(obj) { 
    // do stuff 
    } 

    function remove(obj) { 
    // do stuff 
    } 

    // We now return a public API for our service. 
    return { 
    add: add, 
    store: store, 
    rm: remove 
    }; 
}; 

這是發展中AngularJS服務的很常見模式，它不需要在這些情況下，任何使用this。