Javascript angularjs i18n项目设置_Javascript_Html_Angularjs

Javascript angularjs i18n项目设置

javascript html angularjs

Javascript angularjs i18n项目设置,javascript,html,angularjs,Javascript,Html,Angularjs,我昨天刚开始学习angularjs，所以假设我对此一无所知。我尝试做的第一件事是将我的UI的所有标签放入一个文件中（以便我们可以将它们替换为i18n）据我所知，这可以通过导入js文件，然后在html中添加包含标签的函数作为控制器来实现，如下所示： <html ng-app> ... <script src="js/i18n/en-US.js"></script>  .

我昨天刚开始学习angularjs，所以假设我对此一无所知。我尝试做的第一件事是将我的UI的所有标签放入一个文件中（以便我们可以将它们替换为i18n）

据我所知，这可以通过导入js文件，然后在html中添加包含标签的函数作为控制器来实现，如下所示：

<html ng-app>
...
<script src="js/i18n/en-US.js"></script> <!-- function inside this named lang -->
...
<body>
... <!-- some html -->
<div ng-controller="lang">
<label class="span5">{{nameOfLabelVar}}</label>
</div>
</body>
</html>


...
...
... 
{{nameOfLabelVar}}

这一切都有效。但我现在对代码组织有点迷茫。在这个div里面有一些选择菜单，我也想在上面使用

我希望标签的js代码在一个文件中，页面的视图逻辑在另一个js文件中（页面视图模型的名称.js）。我不确定如何做到这一点。从我可以告诉你的是，不能嵌套ng控制器标记，也不能将它们添加到它将用于的特定标记中

如果有一个全局控制器可以导入页面的所有其他js文件，那就太好了

我打赌这是烘焙到框架中的，我错过了它，所以在正确的方向上轻推是值得赞赏的

谢谢。

我想这个链接：

很好地回答了你的问题。他的方法在概念上与您想要做的类似，但我认为他的实现，包括过滤器，允许您使用类似的构造

<span class="author">{{ 'WRITTENBY' | i18n }} Bruno</span>

{{'writenby'| i18n}}布鲁诺

而不是您建议的更简单的标记。阅读他的文章，看看它是否回答了你的问题，但我认为它确实回答了你的问题。

要获得更灵活的基础，请在做了大量研究后结帐，这是我的2美分：我个人的结论是，到目前为止，图书馆对我来说是最好的。有很多很好的解决方案，比如合并了关于这个主题的两个教程。但角度平移有我需要的所有要求：

安装贯穿式支架
JSON文件支持我喜欢的结构
简易初始化
检查浏览器区域性
在运行时改变文化
伟大的翻译加载器
伟大的文献
最受欢迎，最大的社区，也是唯一一个经常维护

希望对您有所帮助……

以下是我如何完成我的i18n工作，它似乎工作得很好！它基于一组在运行时初始化的本地化资源文件

用于保存字符串id映射和参数插入的I18n模块在任何地方都可以用来翻译这样的字符串

.controller(['$scope', 'I18n', function($scope, I18n) {
    $scope.title = I18n.lang(some_string_id);
}]);

用于处理一次性翻译的自定义i18n指令可以这样使用

<div i18n="some_string_id"></div>

可以这样使用

<div pluralize count="{{obj.count}}" when="{1:'single_item','other': 'multiple_item'}"></div>

其他地区将具有相同的字符串ID，具有不同的翻译文本

.directive('i18n', ['I18n', function(I18n) {
    return {
        restrict: 'A',
        scope: {},
        link: function(scope, $el, attrs) {
            $el[0].innerHTML = I18n.lang(attrs.i18n);
        }
    };
}]);

<div i18n="some_string_id"></div>

.directive('pluralize', ['I18n', function(I18n) {
    return {
        restrict: 'A',
        scope: {
            count: '='
        },
        link: function($scope, $el, attrs) {
            var when  = JSON.parse(attrs.when)
              , param = [$scope.count];
            if (when[$scope.count]) {
                $el[0].innerHTML = I18n.lang(when[$scope.count], param);
            } else {
                $el[0].innerHTML = I18n.lang(when['other'], param);
            }
        }
    };
}]);

<div pluralize count="{{obj.count}}" when="{1:'single_item','other': 'multiple_item'}"></div>

{
    some_string_id: 'This is in English',
    single_item: '%1 item',
    multiple_item: '%1 items'
}