Question

我有一个AngularJS工厂＆＃39; UserSrvc＆＃39;。这负责调用RESTful后端来使用Restangular来获取和创建用户帐户：

(function () {
    'use strict';

    angular
        .module('myapp')
        .factory('UserSrvc', UserSrvc);

    function UserSrvc(Restangular) {

        return {
            getAllUsers: getAllUsers,
            getUser: getUser,
            saveUser: saveUser
        };

        /////////////////////

        function getAllUsers(){
            return Restangular.all('users').getList();
        }

        function getUser(user){
            return Restangular.setFullResponse(true).one('users', user).get();
        }

        function saveUser(user) {
            return Restangular.all('users').post(user);
        }
    };
})();

我的用户控制器具有初始化数据以加载到Angular UI Grid的功能，以及用于保存用户和获取用户数据的功能：

(function () {
        'use strict';

        var controllerId = 'UserCtrl';

        // Define the controller on the module
        // Inject the dependencies.
        // Point to the controller definition function.
        angular
            .module('myapp')
            .controller(controllerId, UserCtrl, ['UserSrvc', 'ngDialog', '$log', 'toaster']);

        function UserCtrl(UserSrvc, ngDialog, $log, toaster){

            // Using the 'Controller As' syntax, so we assign to the vm variable (for view model).
            var vm = this;

            var allUsers = [];

            // Bindable properties and functions are placed on vm.
            vm.activate = activate;
            vm.allUsers = {};
            vm.toggleForm = false;
            vm.saveUser = saveUser;
            vm.gridOptions = {
                data: allUsers,
                enableSorting: true,
                enableColumnResizing: true,
                enableGridMenu: true,
                showGridFooter: true,
                showColumnFooter: true,
                enableFiltering: true,
                columnDefs: [
                    {name: 'firstName', field: 'First'},
                    {name: 'lastName', field: 'Last'},
                    {name: 'login', field: 'Login'},
                    {name: 'email', field: 'Email'}
                ]
            };

            activate();

            function activate() {
                return getUsers().then(function() {
                    // User Controller is now activated
                    $log.info('UserCtrl activated');
                });
            }

            function refreshUserTable() {
                return UserSrvc.getAllUsers()
                    .then(function(data) {
                        // User table refresh
                        vm.gridOptions.data = data.data;
                        $log.info('User table data refreshed.', vm.gridOptions.data);
                });
            }

            function getUsers() {
                return UserSrvc.getAllUsers()
                    .then(function (data) {
                        $log.debug('data: ', data);
                        vm.gridOptions.data = data;
                        //allUsers = data;
                        $log.debug('allUsers: ', vm.gridOptions.data);
                        return vm.gridOptions.data;
                },
                function(response) {
                    $log.debug("Failed to get users, error with status code", response.status);
                });
            }

            function saveUser(vm) {

                var new_user = {
                        "user": {
                            "First": vm.user.firstname,
                            "Last": vm.user.surname,
                            "Login": vm.user.username,
                            "Password": vm.user.password,
                            "Email": vm.user.email
                        }
                    };

                //$log.debug('The user to be saved: ', user);

                return UserSrvc.saveUser(new_user)
                    .then(function (data) {
                        $log.debug('The user to be saved: ', new_user);
                        $log.debug('response: ', data);
                        // Refresh the table
                        refreshUserTable(vm);
                        // Reset the user form
                        resetForm();
                        // Close the form
                        vm.toggleForm = !vm.toggleForm;
                        // Success toast
                        toaster.pop("success","User saved", "User '" + new_user.user.Login + "' successfully created");
                        return data;
                },
                function(response) {
                    $log.debug("Failed to save user, error with status code", response.status);
                    toaster.pop("error", "Unable to save user", "Failed to save user, error with status code " + response.status);
                });
            }

        }
})();

在UserSrvc.getAllUsers()函数中第一次调用getUsers()时，data中的.then(function(data)参数会返回如下数组：

[
  {
    "Last": "Jobs",
    "Email": "test@example.com",
    "Login": "jobs",
    "id": 1,
    "First": "Steve"
  }
]

但是，refreshUserTable()对同一UserSrvc.getAllUsers()的后续调用，来自data的{{1}}参数会返回如下对象：

.then(function(data))

要使其正常工作，我需要通过{ "data": [ { "Last": "Jobs", "Email": "test@example.com", "Login": "jobs", "id": 1, "First": "Steve" } ] }从data对象中提取data数组。

为什么data.data后续调用返回一个对象而不是数组？我怀疑它与我使用Restangular的方式有关，还是有一些我错过的明显的东西？

理想情况下，我想摆脱refreshUserTable()功能，只需使用refreshUserTable()刷新表格即可。

Answer 1

将setFullResponse设置为true，以扩展您的响应对象。您感到困惑，因为Restangular与您使用相同的属性键data。

如果您想在一种方法上专门使用完整响应，只需使用Restangular的withConfig方法。

Restangular.withConfig(function(RestangularConfigurer) {
    RestangularConfigurer.setFullResponse(true);
});

Restangular：第一次调用返回数组但后续调用返回对象

1 个答案: