创建$ angular服务以注入其他组件

时间:2015-02-17 17:14:56

标签: angularjs

我正在使用Angular,我需要在ng-route config中定义路由,但在我的服务中也需要在服务方法中使用$ http。

问题是路由字符串根据语言在我的应用程序中发生变化......例如,对于我可能有的关于我们的页面:

"en/about-us", "pt/quem-somos", "fr/ ..."

应用程序有一个RouteProvider,它按键返回路径字符串。

我们的想法是动态创建一个脚本来获取注入角度组件的服务,以便获取这些路径字符串。

<script type="text/javascript">

  // Create $routes service using backend code ...

</script>

这将在app.config上使用,如下所示:

app.config(['$routeProvider', function($routeProvider, $routes) {

    $routeProvider.
      when($routes.getByKey('about.home', {
      templateUrl: 'about/home.html',
      controller: 'AboutController'
    })
}

但也在服务中如下:

application.service('CountryService', function ($http, $routes) {

  return {

    GetList: function () {
      return $http.get($routes.getByKey('api.countries.list');
    }

  }

});

我的问题是如何编写这样一个服务的JS部分并将其插入角度组件。是否可以创建这样的服务?

1 个答案:

答案 0 :(得分:0)

我不会混淆API端点的视图路由 - 这些是不同的生物。

并且您不需要为每种语言创建路径 - 只需使用语言作为参数:

$routeProvider
  .when("/:lang/about-us", {
    template: "<h3>About Us</h3> in lang: {{language}}",
    controller: function($scope, $routeParams, $location){
      $scope.language = $routeParams.lang;
    }
  })
  .when("/:lang/something-else", {
    template: "<h3>Something Else</h3> in lang: {{language}}",
    controller: function($scope, $routeParams){
      $scope.language = $routeParams.lang;
    }
  })

plunker