AngularJS基於字符串的JSON鍵值對

Question

我似乎在使用JSON數據填充AngularJS中的select元素時遇到了一些問題。

代碼：

/* the API returns: {"id":3,"name":"Some Address"} */ 
 

 
app.service("addressService", function($http, $q) { 
 
    var deferred = $q.defer(); 
 
    $http.get('/index.php/Pro/getAddresses').then(function(data) { 
 
    deferred.resolve(data); 
 
    }); 
 
    this.getCounties = function() { 
 
    return deferred.promise; 
 
    }; 
 
}); 
 

 
app.controller('homeController', function($scope, $http, addressService, $routeParams) { 
 
    $scope.availableCounties = {}; 
 

 

 
    var promise = addressService.getCounties(); 
 
    promise.then(function(data) { 
 
    $scope.availableCounties = data; 
 
    }); 
 
});

<select name="sender_address_id" ng-model="sender_address_id" ng-options="county.id as county.name for county in availableCounties"> 
 

 
</select>

當我查看該頁面，選擇欄仍然無人居住。我也可以控制API。如果使用比json_encode（）更好的函數或方法，那也可以解決問題。

編輯，控制檯輸出鞋子起來就是：

 
Object {data: Object, status: 200, headers: function, config: Object, statusText: "OK"} 
config: Object 
data: Object 
    id: 3 
    name: "Some Address" 

    __proto__: Object 

headers: function (c){a||(a=Xc(b));return c?(c=a[Q(c)],void 0===c&&(c=null),c):a}status: 200 
statusText: "OK" 
__proto__: Object 

Answer 1

格雷格，無後顧之憂，在$ Q不知道響應主體是重要的，所以這就是爲什麼你需要通過。數據進行訪問符號。

我可愛的小在這裏的成功（概述）VS則（） - http://www.peterbe.com/plog/promises-with-$http

Answer 2

包裝紙的$ HTTP查詢到的服務是無用的在這裏，因爲$ HTTP有一個內置的諾言系統（see documentation），和你不要添加任何邏輯（緩存，數據排序等）。

所以，你可以擺脫你的服務，並使用這個死簡單的控制器：

app.controller('homeController', function ($scope, $http) { 
    $scope.availableCounties = []; 

    $http.get('/index.php/Pro/getAddresses') 
     .success(function (data) { 
      $scope.availableCounties = data; 
     }) 
     .error(function (error) { 
      // Eventually do something when request fails 
     }); 
}); 

編輯：

正如評論@kvetis狀態，這是一個很好的做法，以保持http請求在一個地方。如果你關心良好的做法，here is a fiddle演示如何簡單幹淨地做到這一點。