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

首先，您需要在服务后面移动与数据相关的逻辑，因此您的控制器不了解特定于服务器的信息。更重要的是，您的服务可以重复使用，因为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
            });
        }
    };
});

$ http.get到angularjs中的资源

3 个答案: