4

我正在开发基于 Angular JS 的 Phonegap 应用程序。我在 Angular JS 中找到了 I18N 的 2 个选项：

1) https://github.com/gertn/ng-i18n

2) http://angularjs.de/artikel/angularjs-i18n-ng-translate

它们都非常“相似”：有将被翻译的占位符（表达式）。

所以我的问题是：如何在角度服务（而不是表达式/占位符）内的通知警报中翻译纯文本？

4

6 回答 6

12

angular-translate让您可以直接使用他们的$translate 服务。以下是他们文档中的示例代码。

var translations = {
  HEADLINE: 'What an awesome module!',
  PARAGRAPH: 'Srsly!',
  NAMESPACE: {
    PARAGRAPH: 'And it comes with awesome features!'
  }
};

var app = angular.module('myApp', ['pascalprecht.translate']);

app.config(['$translateProvider', function ($translateProvider) {
  // add translation table
  $translateProvider.translations(translations);
}]);

app.controller('Ctrl', ['$scope', '$translate', function ($scope, $translate) {
  // expose translation via `$translate` service
  $scope.headline = $translate('HEADLINE');
  $scope.paragraph = $translate('PARAGRAPH');
  $scope.namespaced_paragraph = $translate('NAMESPACE.PARAGRAPH');
}]);
于 2013-08-03T03:50:27.273 回答
3

您的“纯”文本始终是具体的翻译。因此，如果您想将 i18n 带到您的通知中，您的通知必须使用可以由翻译服务翻译的翻译 ID（如果您使用angular-translate例如）。

特别是，当使用 angular-translate 时，您实际上可以简单地将具体文本传递给翻译组件（服务、过滤器指令）。如果您的翻译表中没有看起来像传递的值（在您的情况下为具体文本）的翻译 id，它将返回该字符串，因此这也将起作用。

<ANY translate="{{notificationFromService}}"></ANY>

如果您对角度翻译还有任何疑问，请让我知道！

于 2013-08-05T19:37:49.047 回答
3

你可以看看 jlg-i18n github 项目：https ://github.com/jlguenego/jlg-i18n

附加值是：

1）在其他解决方案中没有 UPPERCASE_TAG 。相反，您直接将文本放在原始语言中。因此，如果没有找到翻译，则打印原始字符串并且降级不是全部。i18n带过滤器的角度表达式示例：

{{'How are you doing?' | i18n}}

2）有一个插值/复数功能。

{{'You have [[nbr]] message(s) and [[err]] error(s)' | i18n:4:0 }}

输出：

You have 4 messages and no error.
于 2015-05-22T14:57:54.917 回答
1

对于在服务中进行翻译，只需将翻译服务添加到服务中，例如在服务中使用 $http 的方式。

我最喜欢的翻译/i18n 模块是 angular-translate。我在这里分享了为什么。

这是一个如何在控制器内使用角度翻译服务的示例（在服务内使用相同的方式）。

于 2013-08-30T14:52:28.230 回答
0

您可以查看 ui-i18n https://github.com/angular-ui/ui-utils/pull/173，性能优于 angular-translate 并且重量更轻，语法更简单 imo。

干杯，蒂姆·斯威特

于 2014-02-04T05:13:59.927 回答
0

I know @Kevin has already answered ur question, but you can also do something like this using '$filter'.

var translations = {
HEADLINE: 'What an awesome module!',
PARAGRAPH: 'Srsly!',
NAMESPACE: {
PARAGRAPH: 'And it comes with awesome features!'
}
};

var app = angular.module('myApp', ['pascalprecht.translate']);

app.config(['$translateProvider', function ($translateProvider) {
// add translation table
$translateProvider.translations(translations);
}]);

app.controller('Ctrl', ['$scope', '$filter', function ($scope, $filter) {

 $scope.headline = $filter('translate')("HEADLINE");
 $scope.paragraph = $filter('translate')("PARAGRAPH");
 $scope.namespaced_paragraph = $filter('translate')("NAMESPACE.PARAGRAPH");
 }]);

and pass the scope variables to the alert you want to show.

and i think with this approach you don't have to pass your each and every filter(if at all more than one) to the controller and achieve the same result.

于 2014-07-25T07:07:42.750 回答