英杰926

导航

angularjs i18n

<!doctype html>
<html ng-app="myApp">
<head>
    <meta charset="utf-8">
    <title>locale test</title>
    <script src="JS/angular-1.5.8/angular.js"></script>
    <script src="JS/angular-1.5.8/i18n/angular-locale_zh-cn.js"></script>
    <script src="JS/angular-translate.min.js"></script>

</head>
<body>
    <div>
        <h1>{{ 'TITLE' | translate }}</h1>
        <span translate="FOO"></span>
        <div ng-controller="TranslateController">
            <button ng-click="changeLanguage('cn')" translate="BUTTON_TEXT"></button>
            <button ng-click="changeLanguage('en')" translate="BUTTON_TEXT"></button>
        </div>
    </div>
    <script type="text/javascript">
        var app = angular.module("myApp", ['pascalprecht.translate']);

        app.config(['$translateProvider', function ($translateProvider)
        {
            $translateProvider.translations('en', {
                'TITLE': 'Hello',
                'FOO': 'china',
                'BUTTON_TEXT': 'BUTTON_TEXT_en'
            });

            $translateProvider.translations('cn', {
                'TITLE': '你好',
                'FOO': '中国',
                'BUTTON_TEXT': '中文按钮'
            });

            $translateProvider.preferredLanguage('en');

        }]);
        app.controller('TranslateController', function ($translate, $scope)
        {
            $scope.changeLanguage = function (langKey)
            {
                $translate.use(langKey);
            }
        });
    </script>
</body>
</html>

posted on 2018-01-12 16:01  英杰926  阅读(86)  评论(0编辑  收藏  举报