AngularJs：从app.config调用服务/提供程序

Question

我想从app.config中内打电话给我服务。

搜索此内容时，我发现了一个我尝试遵循的解决方案的问题 （不是可接受的答案，而是下面的解决方案，标题为“ 将服务设置为自定义AngularJS Provider ”）

但是，使用该解决方案以及建议的替代方案时，当我尝试从我的app.config中调用服务时遇到了问题（该服务似乎根本没有被调用）。 我是angular和javascript的新手，真的不知道如何正确调试它（我正在使用firebug）。 希望您能为我提供一些指导，并可能提供解决方案。

当前法规 （试图实现所链接问题中的“可能替代品”：

angular.module('myApp', [
  'ngRoute',
])
.config(['$routeProvider', '$locationProvider', '$provide', function($routeProvider, $locationProvider, $provide) {

$provide.service('RoutingService',function($routeParams){
    var name = $routeParams.name;
    if (name == '') {name = 'testfile'}

    var routeDef = {};
    routeDef.templateUrl = 'pages/' + name + '/' + name + '.html';
    routeDef.controller = name + 'Ctrl';
    return routeDef;
})

//Here i would like to get a hold of the returned routeDef object defined above.
$routeProvider.when('/name:', {
                        templateUrl: RoutingService.templateUrl, 
                        controller: RoutingService.controller
                    });

我之前的尝试是通过提供者声明服​​务：

var ServiceModule = angular.module('RoutingServiceModule', []);

ServiceModule.provider('routingService', function routingServiceProvider(){
      this.$get = [function RoutingServiceFactory(){

         return new RoutingService(); 
      }]
});

function RoutingService(){
    this.getUrlAndControllerFromRouteParams = function($routeParams){
        var name = $routeParams.name;

        var routeDef = {};
        routeDef.templateUrl = 'pages/' + name + '/' + name + '.html';
        routeDef.controller = name + 'Ctrl';
        return routeDef;
    }
}

并试图调用它，我将通常所说的在控制器中一个服务（添加后RoutingServiceModel到的依赖关系myApp当然）。 在这两种情况下，当我导航至视图时都未设置templateUrl和controller，因此我想我缺少一些依赖项，或者未正确调用服务。

有任何想法吗？

Answer 1

在配置阶段，只能注入提供程序（除了AUTO模块中的服务-$ provide和$ injector）。

请检查此工作演示： http : //jsfiddle.net/nxbL66p2/

angular.module('Joy',[])
.config(function($provide) {
  $provide.provider('greeting', function() {
    this.$get = function() {
      return function(name) {
        alert("Hello, " + name);
      };
    };
  });
})
.controller('MyCtrl', ['$scope', 'greeting', function ($scope, greeting) {
    $scope.greet = function () {
        greeting('Joy');
    };
}]);

简单的HTML：

<div ng-app="Joy">
    <div ng-controller="MyCtrl">
        <div ng-click="greet()">Click to greet.</div>
    </div>
</div>

参考： https : //github.com/angular/angular.js/wiki/Understanding-Dependency-Injection

Answer 2

Angular的术语有点混乱，因为“ service”和“ provider”可能根据上下文指定不同的内容。 根据手册中的说明 ，

Angular服务是由服务工厂创建的单例对象。 这些服务工厂是由服务提供商创建的功能。 服务提供者是构造函数。 实例化时，它们必须包含一个名为$ get的属性，该属性包含服务工厂功能。

您不能在config注入服务（ constant除外），只能注入服务提供者，而RoutingService在此处不适用。

从技术上讲，您可以通过

RoutingServiceProvider.$get();

但是它将创建一个单独的实例（而不是单例对象），并且在config中调用$routeParams没有意义。

您可以将templateUrl作为函数（请参阅手册 ），而动态控制器名称不适合进行路由配置，而应使用ng-controller在模板中定义它们。