Angularjs app不会将个人用户的ID传递给url

时间:2014-02-03 11:14:38

标签: javascript angularjs

我有一个带有用户列表的角度应用。当我点击编辑时,我需要将特定的用户ID传递到网址,并且我很难做到。当我点击编辑按钮 - www.example.com.users / undefined-并在控制台中显示错误消息时,我得到一个未定义的ID -

Error in resource configuration. Expected response to contain an object but got an array

有很多关于这个错误的SO问题,但似乎是另一种方式,希望响应包含一个数组但得到一个对象。无论如何,我在isArray我的服务方法上将show设置为false,但无效。

谁能看到我出错的地方?

UserCtrl:

angular.module('myApp.controllers')
    .controller('UserCtrl', ['$scope', 'UsersFactory', 'UserFactory', '$location',
    function ($scope, UsersFactory, UserFactory, $location) {



 //This is the function behind my edit button
    $scope.editUser = function (userId) {
        $location.path('/users/' + userId);
    };



    // callback for ng-click 'createUser':
    $scope.createNewUser = function () {
        $location.path('/users/new');
    };

    $scope.users = UsersFactory.query();
}]);

UserEditCtrl:

angular.module('myApp.controllers')
    .controller('UserEditCtrl', ['$scope', '$routeParams', 'UserFactory', '$location',
    function ($scope, $routeParams, UserFactory, $location) {

        // callback for ng-click 'updateUser':
        $scope.updateUser = function () {
            UserFactory.update($scope.user);
            $location.path('/users');
        };

//EDIT: This shows a value of "undefined"
 console.log($routeParams.userId);
        $scope.user = UserFactory.show({id: $routeParams.userId});

    }]);

用户服务:

var app = angular.module('myApp.services');

app.factory('UsersFactory', function ($resource) {
    return $resource('https://example.com/users', {}, {
        query: { method: 'GET', isArray: true },
        create: { method: 'POST' }
    })
});

app.factory('UserFactory', function ($resource) {
    return $resource('https://example.com/users/:id', {}, {
        show: { method: 'GET', isArray: false  },
        update: { method: 'PATCH', params: {id: '@id'} },
        delete: { method: 'DELETE', params: {id: '@id'} }
    })
});

1 个答案:

答案 0 :(得分:1)

您实际上可以使用一个工厂作为资源

app.factory('UserFactory', function ($resource) {
return $resource('https://example.com/users/:id', null, 
   {
      update: { method: 'PATCH' }
   })
});

AngularJS $resource

在您的控制器中,您使用$scope.user = UserFactory.get({id: $routeParams.userId});代替.query()来返回数组。

您还需要确保服务器的响应采用所需的格式。

注意:这是AngularJS v1.2.5