标签: angular-translate

我正在使用 AngularJS 翻译，如果我按照 pascalprecht 的教程使用它，我的 Angular 应用程序将失败并且它不显示任何内容（它不加载部分视图），所以我决定使用 angular-translate-partial-装载机

我有一个应用程序菜单，我有一个 MenuCtrl 来显示选项，我想翻译这个菜单

这是我的代码

 angular.module('myapp'['ngAnimate','ngAria','ngCookies','ngMessages','ngResource','ngRoute','ngSanitize', 'ngTouch', 'pascalprecht.translate'])
.value('language', 'bra')
.run(function ($rootScope, $translate) 
{
  $rootScope.$on('$translatePartialLoaderStructureChanged', function () 
        {
          $translate.refresh();
        }
    );
})
.config(function($translateProvider, $translatePartialLoaderProvider) {
$translateProvider.useLoader('$translatePartialLoader', {
  urlTemplate: 'translations/{lang}/{part}.json'
});
$translateProvider.preferredLanguage("bra");
})
.config(function ($routeProvider) {
$routeProvider
  .when('/', {
    templateUrl: 'views/main.html',
    controller: 'MainCtrl'
  })
  .when('/about', {
    templateUrl: 'views/about.html',
    controller: 'AboutCtrl'
  })
  .otherwise({
    redirectTo: '/'
  });
});

angular.module('myapp')
.controller('MenuCtrl', function ($scope, $translatePartialLoader) {

       $translatePartialLoader.addPart('menu');

        $scope.lItems = [
                    {
                        title: "HOME",
                        class:'active',
                        href:'/',
                        visible: true
                    }, …

我想使用 angular-gettext 在我的应用程序上实现 i18n，我按照这个http://lostechies.com/gabrielschenker/2014/02/11/angularjspart-12-multi-language-support/ 我使用了这个命令：

  npm install -g grunt-cli
  npm install grunt
  npm install grunt-angular-gettext

我的 Gruntfile.js ：

 module.exports=function(grunt){
grunt.loadNpmTasks('grunt-angular-gettext');
//This task will parse all our source files and extract the texts we want to have translated – the ones that have an associated translate directive – and add them to a so called pot file.
grunt.initConfig({
    nggettext_extract:{ //we define the task name we want to configure or initialize
        pot:{
            files:{
                'po/template.pot':['../templates/*.html'] //we want the task to parse all …

我正在使用angular-translate为我的应用程序提供动态语言支持.我也使用了一个日历组件(http://angular-ui.github.io/ui-calendar/),它与angular(jQuery根)不能很好地兼容.为了能够在运行时翻译它,我需​​要检测语言何时发生变化.

基本上我需要知道何时$translate.use()被调用并且语言已被更改.

有没有办法检测语言何时发生变化,以便我可以触发日历组件的翻译？

我在某些情况下使用title属性，我的代码是

<li title="{{admin ? 'purchase license pack':''}}"><span translate>pack.details</span></li>

在这里，如果管理员为true，则显示购买许可证包。但是，如何使用转换过滤器将其设为i18n键。我试过了

<li title="{{admin ? '{{'purchase.pack'|translate}}':''}}"><span translate>pack.details</span></li>

但是它显示了解析错误。这该怎么做？

这两个中哪个更好？

<span translate="key">Key</span>

要么

<span>{{'key' | translate}}</span>

它们既好又可以正常工作，但在第一种情况下，我必须填写元素的内容。

我正在使用translate.instant并进行像这样的字符串连接

var variable = this.$translate.instant('project.discount') + " % " + this.$translate.instant('project.applied_to') + " " +this.office;

我怎样才能在一个 $translate.instant 中作为字符串插值而不是串联来做到这一点

谢谢，

我们最近正在做I18N,我们有一个菜单来切换语言en,jp和fr之间的语言.一旦我们切换语言,网址变得如下,在网址的末尾有一个查询字符串附加.

http://localhost:3030/loadTests?lang=en

这是一个问题,因为我们不会在所有现有链接和href中附加lang参数,如果我们点击网站上的某个链接,则网址将如下:

http://localhost:3030/loadTests/1

查询字符串lang = en没有追加到url的末尾,我们希望lang = en总是追加到url的末尾,我该如何实现呢？

希望我能清楚地描述我的问题.

提前致谢!

我试图在我的角度应用程序中使用一次性绑定来提高性能。所以我想使用下一种方式的angular-translate：

//This code does not work.
function myCtrl($translate){
    $scope.DESCRIPTION = $translate.instant('DESCRIPTION');
}


//I should use a timeout of next way:
//This code does work.
function myCtrl($translate){

   setTimeout(function(){
     $scope.DESCRIPTION = $translate.instant('DESCRIPTION');
   }, 1000);
}

<p> {{::DESCRIPTION}} </p>

如何检测何时加载语言json文件？我不想使用setTimeouts。

我希望你能理解我

谢谢！

我用angular-translate的是i18n。我想使用$translatePartialLoader模块化语言密钥服务作为延迟加载。ui-router我也想为此使用解析选项。

现在该怎么做呢？可以为我添加一个代码示例吗？

谢谢

事情就是这样......我在我的应用程序中使用了一个 angular 4 模板，它有一个很好的工作翻译服务。问题是我不知道如何在代码中使用该管道。

在 HTML 中<span>{{ this.variable | traslate }}</span>，然后，该服务会转到一些 JSON 文件以查找文本并进行翻译。

这是我的 component.ts 中的代码

const SMALL_WIDTH_BREAKPOINT = 960;
@Component({
  selector: 'app-mycomponent',
  templateUrl: './mycomponent.component.html',
  styleUrls: ['./mycomponent.component.scss']
})

export class TrackingComponent implements OnInit { 
  currentLang = 'es';
  private mediaMatcher: MediaQueryList = matchMedia(`(max-width: 
  ${SMALL_WIDTH_BREAKPOINT}px)`);
  constructor(
    public translate: TranslateService,
    zone: NgZone,
    private router: Router,
  ) {
    const browserLang: string = translate.getBrowserLang();
      translate.use(browserLang.match(/en|es/) ? browserLang : 'es');
      this.mediaMatcher.addListener(mql => zone.run(() => {
        this.mediaMatcher = mql;
      }));
      translate.use(this.currentLang);
  }

  ngOnInit() { } …