标签: angular-translate

我正在使用最新版本的angularjs和angular-translate.

出于某种原因,我不希望我的存储静态翻译以.json文件(en_US.json或ru_RU.json)

angular-translate中是否有任何API 调用REST API,而REST API又返回json数据进行翻译.REST API将拉取翻译存储在数据库中.

我的视图中有一个日期列表,由我的控制器提供支持.我使用angular-translate来管理我的所有应用程序中的本地化,但不知道如何处理日期对象.

我的HTML看起来像这样:

<div ng-repeat="date in nextDates">
    <div class="day">{{date | date: 'EEEE'}}</div>
</div>

此代码显示一天的列表:星期一,星期二,...基于date哪个是日期对象.

我的第一次尝试是使用已经在这个项目中使用的moment.js,并且与i18n进行了很好的交易.它工作正常,但是当用户改变lang时我很难更新它,因为moment.js与angular-translate无关.

我尝试在我的控制器上使用事件来实现它来更新我的变量,但效果不佳.我想在我的视图中保留对象日期而不是有一个时刻对象,我确信有一种方法不能手动实现它.

$scope.$on('translationChanged', function(event, lang) {
    ...
});

我想知道是否有一种简单的方法来解决这个问题,我唯一的想法是生成一个像DAY.0周一一样的翻译密钥,DAY.1并自己翻译,但听起来很便宜.moment.js对于这项工作来说似乎很完美,但是如何将它与angular-translate联系起来呢？

谢谢阅读.

我是Angular应用程序中的角度翻译新手.

要求:

我必须创建一个多语言应用程序AngularJS,用户可以选择设置他的语言.因此,为此,我必须从文件加载翻译并保存该首选语言localStorage.因此,如果用户再次访问该应用程序,他将显示先前设置的语言.

到目前为止我做了什么:

使用的加载文件翻译 $translateProvider.useStaticFilesLoader

代码:

var app = angular.module("myLangApp", ['pascalprecht.translate'])
app.config(function($translateProvider) {
$translateProvider.useStaticFilesLoader({
        prefix: 'languages/',
        suffix: '.json'
      });
    $translateProvider.useLocalStorage();
});

如果我评论此行,应用程序工作正常:

// $translateProvider.useLocalStorage();

但是,如果我使用它,我在控制台上收到此错误:

我也把angular-translate-storage-local.min.js文件包含在我的index.html.但是没有成功.

我也在SO中看到了这些问题,但它们没有帮助: Angular-translate的localStorage:未知的提供者:$ translateLocalStorageProvider

任何直接的帮助都将非常值得注意.谢谢

我有以下场景:

我有一个包含这种数据的JSON文件:

"IOS_TABLET_DOWNLOAD_URL": {
  "type": "string",
  "minLength": "5",
  "title": "IOS_TABLET_DOWNLOAD_URL",
  "description": "$filter('translate')('configuration.IOS_TABLET_DOWNLOAD_URL')"
},

描述字段需要使用Angular Translate进行翻译,我正在将服务注入到我的控制器中

ConfigController.$inject = ['$scope', '$filter', '$compile', 'MyService'];
function ConfigController($scope, $filter, $compile, MyService) {

  // And using compile
  $scope.schema = elements; // Where element is the object from MyService
  $compile($scope.schema)($scope);

}

但是,$ filter将作为视图中的描述进行未处理打印

"$过滤器( '翻译')( 'configuration.IOS_TABLET_DOWNLOAD_URL')"

编辑

我正在使用Angular Schema Form生成表单.所以基本上我在视图中有这样的东西

<div ng-controller="FormController">
   <form sf-schema="schema" sf-form="form" sf-model="model"></form>
</div>

我该怎么做？

我正在使用angular-translate进行本地化,我对"sanitize"和"sanitizeParameters"转发策略之间的差异有点不清楚.

我已经检查了文档,但我仍然不明白"在翻译文本中清理HTML"意味着vs"清除值中的HTML".一个人比另一个人安全吗？

如果只是在插值参数的值中清理HTML,是不是要彻底清理内容？我能看到的唯一区别是'sanitizeParamters'在使用过滤器时会转义html,而'sanitize'则不会.我不能使用'清理'策略,因为这里解决了utf8问题,所以我想确保使用'sanitizeParameters'是一种安全的策略.

我正在使用if/else表达式和HTML输入元素的占位符-Tag内的可能值的转换.它显然不能以这种方式工作,因为placeholder-tag中嵌套的双引号:

<input type="number" 
       placeholder="{{constraint ? '{{"TERM_A" | translate}}' : '{{"TERM_B" | translate}}'}}"
       ng-model="" 
       required 
       autocapitalize="none" 
       autocorrect="off" /> 

如何相应地设置单引号/双引号,还是有更优雅的解决方案？

我正在使用angular-translate为我的应用程序提供i18n,我能够正确翻译标签,按钮文本等.我面临的问题是当我尝试根据所选语言区域设置更改日期时.日期从日期选择器中选择.

日期被选入输入元素:

<input type="text" class="form-control" required="" ng-model="date" placeholder="{{ 'DATE_PLACEHOLDER' | translate }}" translate="{{ 'select_date'|translate:{date:date} }}"/>

占位符转换工作正常,但是当我更改语言时,日期格式没有发生变化.我创建了一个描述当前场景的plunkr.

Plunker Link

请建议一种方法,我可以在其中翻译插入的值或表单中的文本.此外,我想知道如何在加载页面之前克服键值的闪烁.

我有一个使用AngularJS的非常简单的datepicker，我想给它一个占位符，以便使用AngularJS转换它（就像我通常在我的项目中一样）。

这是我的HTML代码：

<div flex class="layout-row">
        <md-datepicker ng-model="vm.calendarEvent.start" ng-model-options="{ timezone: 'UTC' }" md-placeholder="Une date" translate translate-md-placeholder="PROF.SHARE.DUE">
        </md-datepicker>
</div>

这样做会引发此错误：

错误：[$ compile：multidir]多个指令[mdDatepicker（模块：material.components.datepicker），翻译（模块：pascalprecht.translate）]要求以下新/隔离范围：

<md-datepicker class =“ ng-pristine ng-untouched ng-valid _md-datepicker-has-triangle-icon” ng-model =“ vm.calendarEvent.start” ng-model-options =“ {时区：'UTC' }“ md-placeholder =”使用日期“ translation =”“ translate-md-placeholder =” PROF.SHARE.DUE“>

我正在尝试将角度翻译添加到我的角度应用程序中。我遵循了这个简单的快速入门：https://angular-translate.github.io/docs/#/guide，但我的应用程序不会引导，给我以下错误：

未捕获的错误：[$injector:modulerr] 无法实例化模块 myApp，原因是：错误：[$injector:modulerr] 无法实例化模块 pascalprecht.translate，原因是：错误：[$injector:nomod] 模块“pascalprecht.translate”是无法使用！您要么拼错了模块名称，要么忘记加载它。如果注册模块，请确保将依赖项指定为第二个参数。

我的index.html文件正确包含角度翻译，如下所示：

<script src="bower_components/angular-translate/angular-translate.js"></script>

任何线索为什么会发生这种情况？我真的很感激你的帮助。

更新

这是我的app.js的一部分，用于澄清一些事情：

var app = angular.module('myApp', [
  'ngAnimate',
  'ngCookies',
  'ngResource',
  'ngSanitize',
  'ngTouch',

  // 3rd party modules.
  'ui.router',
  'restangular',
  'angular.filter',
  'ui.bootstrap',
  'pascalprecht.translate',


  // Custom modules.
  'myApp.config'
])
.
.
.

我正在使用Angular 翻译进行开发。我想知道是否有一个全局配置可以一次性绑定翻译。

我期待的东西

$translateProvider.enableOneTimeBinding(true);