javascript - 为什么 select 标签没有填充我的 ng-options？

Question

我从服务器返回了数组，并且本地 $scope.customers 已填充(我已在调试器中验证了这一点)；但是，我似乎无法用数组填充我的选择标签:

Angular Controller :

surchargeIndex.controller('SurchargeIndexController', [ "$scope", "customerService", "templateService",
    function ($scope, customerService, templateService) {
    customerService.getTest().then(function (customers) { $scope.customers = customers; });
    //templateService.getTemplates.then(function (templates) { $scope.getTemplates = templates; });
}]);

cshtml:

<div class="dropdown">
    <select ng-model="customerKey" ng-options="customer.Key as customer.Value for customer in customers"></select>
    <button id="getTemplates" class="btn btn-primary" ng-click="getTemplates(customerKey)">Get Templates</button>
</div>

当我检查选择元素时，除了一个元素之外什么都没有:

 <option value="?" selected="selected"></option>

JSON 字符串:

[
    {
    Key: 500,
    Value: "Test Customer 1"
    },
    {
    Key: 11304,
    Value: "test Customer 2"
    },
    {
    Key: 11345,
    Value: "Test Customer 3"
    },
]

服务:

surchargeIndex.service('customerService', [
    '$http', function ($http) {
        this.getTest = function () {
           return $http({
                    method: "GET",
                    url: "api/Customer/GetTest",
                })
                .success(function(data) {
                    return data;
                });
        };
    }
]);

我尝试在选项标签上使用 ng-reepat(我意识到这不是首选方式)，并且得到 15 个(数组中的项目数)空白选项。

我错过了什么？

Answer 1

传递给 then 的 successCallback 将接收表示响应的对象形式的单个参数。

您想要使用data属性:

customerService.getTest().then(function(result) {
  $scope.customers = result.data;
});

或者，您也可以使用 success 方法。传递给它的回调接收四个参数:

success(function(data, status, headers, config) {

示例:

customerService.getTest().success(function(data) {
  $scope.customers = data;
});