I18N / Angular JS / Javascript 文本
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/18022356/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
I18N / Angular JS / Javascript Text
提问by DehMotth
I′m developing a Phonegap App based on Angular JS. I found 2 options for I18N in Angular JS:
我正在开发一个基于 Angular JS 的 Phonegap 应用程序。我在 Angular JS 中找到了 I18N 的 2 个选项:
1) https://github.com/gertn/ng-i18n
1) https://github.com/gertn/ng-i18n
2) http://angularjs.de/artikel/angularjs-i18n-ng-translate
2) http://angularjs.de/artikel/angularjs-i18n-ng-translate
They both are very "simliar": There are placeholder (expressions) which will be translated.
它们都非常“相似”:有将被翻译的占位符(表达式)。
So my question is: how to translate pure text in e.g. a notification alert which is inside an angular service (and not in an expression/placeholder)?
所以我的问题是:如何翻译纯文本,例如在角度服务内(而不是在表达式/占位符中)的通知警报中?
回答by Kevin Hakanson
angular-translatelets you use their $translate servicedirectly. Below is sample code from their documentation.
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');
}]);
回答by jlguenego
You may have a look at the jlg-i18n github project: https://github.com/jlguenego/jlg-i18n
你可以看看jlg-i18n github项目:https: //github.com/jlguenego/jlg-i18n
The added value is:
附加值是:
1) There is no UPPERCASE_TAG like in the others solutions. Instead you put directly the text in the original language. So if no translation is found, the original string is printed and the degradation is not total.
Example of an angular expression with i18n
filter:
1) 在其他解决方案中没有 UPPERCASE_TAG 。相反,您直接将文本放入原始语言中。因此,如果未找到翻译,则打印原始字符串并且不会完全降级。带i18n
过滤器的角度表达式示例:
{{'How are you doing?' | i18n}}
2) There is a interpolation/pluralization functionnality.
2) 有插值/复数功能。
{{'You have [[nbr]] message(s) and [[err]] error(s)' | i18n:4:0 }}
output:
输出:
You have 4 messages and no error.
回答by Pascal Precht
Your 'pure' text is always a concrete translation. So if you want to bringt i18n to your notifications, your notifications have to use translation id's which can the be translated by a translate service (if you use angular-translate
e.g.).
您的“纯”文本始终是具体的翻译。因此,如果您想将 i18n 带到您的通知中,您的通知必须使用翻译 ID,该 ID 可以由翻译服务翻译(如果您使用angular-translate
eg)。
Especially, when using angular-translate, you could actually simply pass your concrete text to a translate component (service, filter directive). If there isn't a translation id in your translation table that looks like the passed value (in your case a concrete text) it'll return that string, so this will also work.
特别是,当使用 angular-translate 时,您实际上可以简单地将具体文本传递给翻译组件(服务、过滤器指令)。如果您的翻译表中没有看起来像传递的值(在您的情况下是具体文本)的翻译 ID,它将返回该字符串,因此这也将起作用。
<ANY translate="{{notificationFromService}}"></ANY>
<ANY translate="{{notificationFromService}}"></ANY>
If you have any further questions about angular-translate, please lemme know!
如果您对 angular-translate 有任何进一步的问题,请让我知道!
回答by Urigo
For Translating inside a service, just add the translation service to the service, like the way you use $http inside a service for example.
对于在服务内部进行翻译,只需将翻译服务添加到服务中,例如您在服务内部使用 $http 的方式。
My favorite translation/i18n module is angular-translate. I've shared herewhy.
我最喜欢的 translation/i18n 模块是 angular-translate。我在这里分享了原因。
Here is an exampleof how to use the angular-translate service inside a controller (use the same way inside a service).
回答by timothyswt
You can check out ui-i18n https://github.com/angular-ui/ui-utils/pull/173, the performance is better than angular-translate and is lighter weight with a simpler syntax imo.
您可以查看 ui-i18n https://github.com/angular-ui/ui-utils/pull/173,性能比 angular-translate 更好,重量更轻,语法更简单 imo。
Cheers, Tim Sweet
干杯,蒂姆·斯威特
回答by syed99
I know @Kevin has already answered ur question, but you can also do something like this using '$filter'.
我知道@Kevin 已经回答了你的问题,但你也可以使用“$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.
我认为使用这种方法,您不必将每个过滤器(如果有多个过滤器)传递给控制器并获得相同的结果。