`

angularjs实现国际化

 
阅读更多

1.引入js文件

<script type="text/javascript" src="resources/angular/angular.min.js"></script> 
<script type="text/javascript" src="resources/angular/angular-cookies.min.js"></script>//要求angularjs版本为1.6以上
<script type="text/javascript" src="resources/angular/angular-translate.min.js"></script>

 

 

2.注册配置

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

app.config('$translateProvider', function ($translateProvider) {
    $translateProvider.translations('en_US', {
        TITLE: 'Login'
    });
    $translateProvider.translations('zh_CH', {
        TITLE: '登录'
    });
    //默认语言
    $translateProvider.preferredLanguage('zh_CH');
  //保存到cookie中 
    $translateProvider.useCookieStorage();
});

app.controller('ngCtrl',function($scope, $translate){ 
	//国际化  
    $scope.setLang = function(lang) {
        $translate.use(lang);  
    }; 
});

 

3.页面调用事件

    <a href="#" ng-click="setLang('en_US')">English</a> | <a href="#" ng-click="setLang('zh_CH')">中</a>  

 

分享到:
评论

相关推荐

    AngularJS国际化详解及示例代码

    为了实现国际化,AngularJS提供了一套机制,允许开发者引入针对特定语言或地区的JavaScript文件,这些文件通常包括了该语言或地区所需的所有本地化数据。例如,如果要使用丹麦语的语言环境,开发者可以引入特定的...

    ng-intl-tel-input, AngularJS 1.4. x 模块实现国际intl输入( https.zip

    ng-intl-tel-input, AngularJS 1.4. x 模块实现国际intl输入( https ng-intl-tel-input实现intl-tel-input指令的AngularJS 1.5. x 模块( https://github.com/Bluefieldscom/intl-tel-input ) 它做什么初始化

    AngularJs 国际化(I18n/L10n)详解

    在AngularJs中实现国际化与本地化并非一个简单的任务,它涉及到对应用架构的深入理解和对不同区域文化差异的尊重。从抽取字符串、配置区域特定的文件到处理货币符号和格式,每一步都需要细致的工作,以确保软件产品...

    angularjs-i18n:AngularJS 国际化演示

    **AngularJS 国际化(i18n)详解** AngularJS,作为一款强大的前端JavaScript框架,提供了丰富的功能,其中包括对应用程序的国际化支持,也就是我们常说的i18n。这个"angularjs-i18n"项目是一个示例,旨在展示如何...

    AngularJS笔记

    5. **国际化(I18n)与本地化(L10n)**:AngularJS支持多种语言和文化特性的显示,使其易于在国际化的环境中使用。 6. **服务(Service)**:服务是可重用的功能单元,如数据访问对象(DAO)、工厂和值提供者,用于封装...

    angularjs breadcrumb

    在本篇文章中,我们将深入探讨如何在AngularJS中添加breadcrumb功能,并且实现国际化(i18n)支持。 首先,我们需要了解AngularJS的基础知识。AngularJS是一个MVC(模型-视图-控制器)框架,用于构建动态Web应用。...

    Professional AngularJS

    此外,书中可能还涉及到了更复杂的主题,如异步编程、动画支持、AOT编译、国际化和本地化,以及如何将AngularJS与其他库和工具(如Bootstrap、jQuery等)集成。通过阅读《Professional AngularJS》,开发者可以深入...

    angular 实现网站多语言-国际化

    在开发Web应用时,提供多语言支持是必不可少的,尤其...通过这个多语言示例,开发者可以了解Angular的i18n机制,并在自己的项目中轻松实现国际化。这不仅提高了用户体验,也为全球范围内的推广和使用奠定了坚实的基础。

    AngularJS 日期格式化详解

    AngularJS是Google开发的一个开源的JavaScript框架,主要用于...在国际化网站开发过程中,日期和时间的格式化变得尤为重要。开发者可以利用AngularJS的过滤器对日期进行本地化处理,以适应不同地区用户的习惯和标准。

    angularjs移动端时间插件

    3. **多语言支持**:插件通常会内置多种语言,如英语、中文等,方便国际化应用的开发。 4. **事件监听**:提供事件绑定功能,如选中日期或时间后的回调函数,便于开发者实现更复杂的业务逻辑。 5. **可配置选项**:...

    AngularJS Novice to Ninja (英文)

    14. 第十五章“Deployment and Internationalization”讲述了应用的部署和国际化(i18n)的策略。 15. 第十六章“Authentication and Authorization in AngularJS”是关于AngularJS应用中的身份验证和授权,确保...

    ABP angularjs 最新版

    7. **多语言支持**:ABP提供了多语言支持,使得应用程序能够适应不同的国际化需求。 8. **UI模板**:ABP AngularJS模板可能包含预定义的UI组件和布局,如导航菜单、表单、对话框等,帮助快速构建用户界面。 9. **...

    angularjs-datetime-picker.rar

    6. **国际化支持**:考虑到全球化的应用需求,插件通常会提供多语言支持。"angularjs-datetime-picker"可能也包含了多种语言包,允许开发者轻松切换到不同的语言环境。 在实际应用中,开发者可以通过以下步骤使用...

    The Complete Book on AngularJS 2

    4. **国际化**:Angular 2支持多语言,可以轻松实现应用的国际化。 5. **性能优化**:了解懒加载、AOT编译、tree shaking等技术,以提高应用的加载速度和运行效率。 6. **安全**:学习如何处理XSS、CSRF等安全问题...

    浅析如何利用angular结合translate为项目实现国际化

    Angular Translate使得在Angular应用中实现国际化变得简单。通过`ng-bind-html`改善了用户体验,避免了翻译未完成时的页面展示问题。配置和使用Angular Translate,包括动态加载JSON文件,可以满足项目对多语言支持...

    angular-chess:用 angularJS 编写的国际象棋克隆

    AngularChess是一款利用AngularJS框架实现的国际象棋游戏,它展示了AngularJS在构建交互式Web应用中的强大功能。AngularJS,作为Google维护的一个前端JavaScript框架,以其双向数据绑定、模块化、依赖注入等特性深受...

    mobiscroll AngularJS版

    2. **多语言支持**:支持全球多种语言,方便国际化的应用开发。 3. **触摸友好**:针对移动设备优化,确保在触摸屏上的良好操作体验。 4. **跨平台兼容性**:不仅适用于iOS、Android等移动设备,还支持桌面浏览器,...

Global site tag (gtag.js) - Google Analytics