$http.get 到 angularjs 中的资源

Question

我如何将以下代码形式从 $http.get 更改为 $resource

//The created resource (not using it for now)
hq.factory('LogsOfUser', function ($resource) {
    return $resource('/HQ/Graph/GetLoggedinTimes?userName=:userName', {
        userName: '@userName'
    })
});

//The Controller
var ModalViewLogActionsCtrl = function ($scope, $http, $log, LogsOfUser, $modal) {
    $scope.openLogs = function (userName) {
        $http.get("/HQ/Graph/GetLoggedinTimes?userName=" + userName).success(function (data) {
            var modalInstance = $modal.open({
                templateUrl: 'LogView.html',
                controller: 'ModalLogViewInstance',
                resolve: {
                    items: function () {
                        //$scope.items = data;
                        $log.log(data);
                        $scope.items = data;
                        return $scope.items; //return data;
                    },
                    userName: function () {
                        return userName;
                    }
                }
            });
        }).error(function () {
            alert("eror :(");
        });;
    };
};

Answer 1

您已经完成了大部分工作。您现在只需要调用控制器内的服务：

LogsOfUser.query({
    userName: userName
}, function success(data) {
    //your code
}, function err() {
    alert("Error")
});

使用query 获取数据数组，使用get 获取单个文档。

Answer 2

这是一个如何从控制器调用资源的示例：

app.controller('MainCtrl', function($scope, $resource) {
   var userName = 'Bob';
   var LoggedinTimes = $resource('/HQ/Graph/GetLoggedinTimes');
   var data = LoggedinTimes.get({userName : userName}, function () {
        console.log(data);
   });
});

Answer 3

首先，您希望将与数据相关的逻辑移到服务后面，因此您的控制器不知道服务器的具体情况。更重要的是，您的 Service 变得可重用，因为 AngularJS 中的所有服务都是全局单例。你的控制器应该保持很小。

接下来，您的控制器将调用getLoggedIntimes() 并处理结果就好像数据在那里。 $resource.get() 或类似函数的结果返回一个空对象或数组，当 REST 调用返回数据时，它会自行填充。

在您的服务中，您将执行实际的$resource.get()。

类似于以下伪代码：

//The Controller
var ModalViewLogActionsCtrl = function ($scope, MyService, $log, LogsOfUser, $modal) {
    $scope.openLogs = function (userName) {
        var items = MyService.getLoggedInTimes(userName);

        var modalInstance = $modal.open({
            templateUrl: 'LogView.html',
            controller: 'ModalLogViewInstance',
            resolve: {
                items: function () {
                    $scope.items = items;
                    return $scope.items;
                },
                userName: function () {
                    return userName;
                }
            }
        });

    };
};


app.service('MyService', function ($resource) {
    var loggedInResource = $resource('/HQ/Graph/GetLoggedinTimes/:userName');

    return {
        getLoggedInTimes: functio(username) {
            return loggedInResource.get({
                username: username
            });
        }
    };
});