AngularJS 国际化 支持记录语言刷新后语言不变

前端之家收集整理的这篇文章主要介绍了AngularJS 国际化 支持记录语言刷新后语言不变前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

AngularJS 国际化 支持记录语言刷新后语言不变

<!DOCTYPE html>
<html ng-app='app'>
<head>
  <Meta charset="utf-8">
  <title translate="TITLE">Remember language (cookies)</title>
  <style>body { text-align: center; }</style>
</head>
<body ng-controller="ctrl">
  <p>
    <a href="#" ng-click="setLang('en_US')">English</a>
    |
    <a href="#" ng-click="setLang('zh_CN')">中文</a>
  </p>
  <h1 translate>HEADER</h1>
  <h2 translate>SUBHEADER</h2>
<script src="https://code.angularjs.org/1.5.10/angular.js"></script>
<script src="../bower_components/angular-cookies/angular-cookies.js"></script>
<script src="../dist/angular-translate.js"></script>
<script src="../dist/angular-translate-storage-cookie/angular-translate-storage-cookie.js"></script>

<script>
// 需要依赖ngCookies
angular.module('app',['pascalprecht.translate','ngCookies'])
.config(['$translateProvider',function($translateProvider){
	
  // 添加英语语言的转换表
  $translateProvider.translations('en_US',{
    "TITLE"     : "How to remember a language (coockies)","HEADER"    : "Your application is able to remember a language between requests.","SUBHEADER" : "To store the language you can use cookies."
  });
  // 添加中文语言的转换表
  $translateProvider.translations('zh_CN',{
    "TITLE"     : "怎样记住选择语言(cookies)","HEADER"    : "您的应用程序可以存储请求之间的语言。","SUBHEADER" : "要存储可以使用Cookie的语言。",});
  // 设置默认的语言
  $translateProvider.preferredLanguage('en_US');
  // 将语言类型存放在cookies中
  $translateProvider.useCookieStorage();

}]).controller('ctrl',['$scope','$translate',function($scope,$translate) {
  	$scope.setLang = function(langKey) {
    $translate.use(langKey);
  };
}]);
</script>
</body>
</html>
原文链接:https://www.f2er.com/angularjs/148138.html

猜你在找的Angularjs相关文章