【问题标题】:Translating during config phase (using angular-translate)在配置阶段翻译(使用角度翻译)
【发布时间】:2016-01-16 21:30:40
【问题描述】:

我正在开发我的 Angular Web 应用程序的 i18n 部分,我想在我的配置阶段使用 angular-translate。

我定义了一些我想翻译的数据:

.state('app.tracking', {
    url: '/:IdentityIdentifier',
    params:{
        IdentityIdentifier: {squash: false, value: null}
    },
    templateUrl: 'views/pages/tracking.html',
    data : { title: $filter('translate')('tracking.tracking.TITLE') },
    resolve: load([], function(){ return loadGoogleMaps(); })
})

这是我的配置声明:

.config(
  [          '$stateProvider', '$urlRouterProvider', '$locationProvider', 'MODULE_CONFIG', '$httpProvider', '$filter',
    function ($stateProvider,   $urlRouterProvider,   $locationProvider,   MODULE_CONFIG,   $httpProvider,   $filter) {

我得到的错误很经典:Error: [$injector:unpr] Unknown provider: $filter

我知道我不能在配置阶段使用服务,只能使用提供程序,但是我的问题有解决方案吗?

编辑:我的问题已通过将键 'tracking.tracking.TITLE' 分配给我的 data.title 变量来解决,然后在我的标记中使用 translate 指令翻译它。

【问题讨论】:

  • 感谢您的编辑。真的很有帮助。我什至创建了一个自定义翻译过滤器,我在 title 标记中使用该过滤器在页面标题后缀一个取决于语言的字符串。

标签: angularjs angular-translate


【解决方案1】:

是的,就像问题编辑中提到的那样:在标记中应用过滤器显然是最简单的解决方案。

除此之外,如果真的想在配置阶段访问服务,请继续阅读:

这在 Angular

从 Angular v1.5(当前 rc 版本为 1.5.0-rc.0)开始,这似乎是可能的,虽然我不建议这样做,因为配置阶段应该只是首次使用服务之前配置服务的位置。

This is the change that made the following possible (link to angular.js repo at github)(仅用于装饰$injector)。

现在,例子来了: http://codepen.io/NicBright/pen/PZJBPP?editors=101

JS部分:

(function() {
  var result;

angular.module('myApp', [])
  .config(function($injectorProvider) {
    result = $injectorProvider.$get().get('myService').getSomething();
  })
  .factory('myService', function() {
    return { getSomething: function() { return 'it works!'; }}
  })
  .controller("MainCtrl", function($scope) {
    $scope.result = result;
  })

})();

HTML 部分:

<div ng-app="myApp" ng-controller="MainCtrl">
  result: {{ result }}
</div>

【讨论】:

  • 太棒了!是时候升级了:)
  • 是的。 v1.5 还将为指令带来多重嵌入 :-) 但请注意我的编辑,我认为不应在配置阶段访问服务。我认为这个“功能”不是故意添加的,所以可能会有副作用。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2019-11-26
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多