Question

我有这项服务：

angular.module('autotestApp').factory('GroupService', ['$http', function ($http) {
    var groups = [];

    return{
        list: function () {
            return groups;
        },
        retrieve: function () {
            $http({
                method: "get",
                url: "/enterprises/_groups"
            }).success(function (response) {
                groups = response;
            }).error(function () {
                console.log("failed")
            });
        }
    }
}]);

这是我的控制者：

angular.module('autotestApp').controller('GroupsController', function($scope, $http, GroupService) {
    GroupService.retrieve();
    $scope.items = GroupService.list();
});

因此，在我的控制器中，我首先从API获取结果，以便分配变量组（在服务中），然后我使用list（）方法将值分配给$ scope.items。

我确信API正在返回结果。但是

groups = response

部分无法正常工作。当我把它改成

groups.push(response)

它正在工作，但结果是列表中的列表，我不想要：[[Object，Object，Object]]

我想要这个：[对象，对象，对象]

如何解决这个问题？

Answer 1

您可以使用的修复之一是：

for (var i = 0; i < response.length; i++) {
     groups.push(response[i]);
});

这样你就会[ Object, Object, Object ]

修改

您可以尝试的一件事是以下内容，更改您的检索功能以返回您的承诺：

return{ list: function () { return groups; }, retrieve: function () { var promise = $http({ method: "get", url: "/enterprises/_groups" }).success(function (response) { groups = response; }).error(function () { console.log("failed") }); return promise; } }

然后在你的控制器中：

angular.module('autotestApp').controller('GroupsController', function($scope, $http, GroupService) { GroupService.retrieve().finally(function () { $scope.items = GroupService.list(); }); });

我认为您的groups = response正在运作，但当您执行$scope.items = GroupService.list()时，请求尚未完成。

Answer 2

原因

groups = response

无法正常工作是因为您已经通过list功能检索到旧参考后发送了将替换群组引用的异步请求。它与push修改一起使用的原因是因为Angular创建了一个监视集合已更改并更新视图的监视。但是，您的代码现在正在运行，但您不了解其工作原理，并且很容易意外破解。

处理异步代码时，处理异步代码的最佳方法是编写自己的代码以将其考虑在内。这是一个以异步方式完成整个事情的版本：

angular.module('autotestApp').factory('GroupService', ['$http', function ($http) {
    var groupsResult;

    return{
        retrieve: function () {
            if (groupsResult) { return groupsResult; }
            return groupsResult = $http({
                method: "get",
                url: "/enterprises/_groups"
            }).then(function (response) {
                return response.data;
            }, function () {
                console.log("failed")
            });
        }
    }
}]);

angular.module('autotestApp').controller('GroupsController', 
    ['$scope', 'GroupService', function($scope, GroupService) {
        GroupService.retrieve().then(function (groups) {
            $scope.items = groups;
        });
    }]);

Answer 3

做groups.concat(response) 这将使项目变得平坦。将其添加到父列表而不是附加单个元素。

angularjs服务没有按预期工作

3 个答案: