javascript - AngularJS:全局访问服务？

Question

我有一个简单的设置，但我可能不是“像 JS 程序员一样思考”。对于不同的页面有多个 Controller ，它们都调用 ajax 到 PHP 的例程。简化版本如下。它正在工作，但我显然没有正确设置它，因为我必须将所有这些服务对象传递给每个调用......应该如何设置？

app.controller('ctrlA', $scope, $http, $location, $sce) {
    app.db_read($scope, $http, {param: 1}, $sce, 
         function() {// succeeded},
         function() {// failed}
    )
}

app.controller('ctrlB', $scope, $http, $location, $sce) {
    app.db_read($scope, $http, {param: 1}, $sce, 
         function() {// succeeded},
         function() {// failed}
    )
}
...
app.db_read = function($scope, $http, payload, $location, $sce) {
    $http.post('url', {request: 'read', data: payload})
         .then(function(data) {$scope.data = data},
         function(error) {$scope.displayError = $sce.trustAsHtml(error)}
    )
}

我看了这个问题:Instantiate global services in AngularJS ...答案显示为“服务在 Angular 中是单例，因此您应该将它们注入(inject)到需要的地方。” 不幸的是，我不知道如何将服务“注入(inject)”到我的 db_read 函数中。感谢您的帮助。

Answer 1

您链接到的帖子中提到的服务不是您当前传递给函数的服务对象(由 Angular 提供的服务)，而是自定义服务。

Angular 中使用的常见模式将 db_read 函数放入返回服务对象的工厂函数中。

app.factory('dbservice', function($http) {

    return {
        db_read: function(payload) {
            return $http.post('url', {request: 'read', data:payload})
        }   
    }

})

这是您想要注入(inject) Controller 的工厂函数。

app.controller('ctrlA', function($scope, $sce, dbservice) {

    $scope.read = function(payload) {
        return dbservice.db_read(payload)
            .then(function(data) {$scope.data = data},
             function(error) {$scope.displayError = $sce.trustAsHtml(error))
    }
})

然后您可以从 Controller 的模板传递有效负载:

<button ng-click="read({param: 1})"></button>

或者从您的 Controller 内部:

    var payload = {param: 1}
    return dbservice.db_read(payload)
        .then(function(data) {$scope.data = data},
             function(error) {$scope.displayError = $sce.trustAsHtml(error))