AngularJS国际化配置

下载angular-translate

下载zip包:https://github.com/angular-translate/bower-angular-translate/releases

引入到js文件

<script src="/bower_components/angular-translate-2.15.2/angular-translate.min.js"></script>
<script src="/bower_components/angular-translate-loader-static-files-2.15.2/angular-translate-loader-static-files.min.js"></script>

加载tranlate组件

var authModule = angular.module("AuthModule", ['pascalprecht.translate']);

var transProvider = function($translateProvider) {
var lang = window.localStorage.lang || 'cn';
$translateProvider.preferredLanguage(lang);
$translateProvider.useStaticFilesLoader({
prefix: '/i18n/',
suffix: '.json'
});
}; authModule.config(['$translateProvider', transProvider]);

建立多语言文件

在项目中建立i18n目录。并且在目录下建立对应语言的文件,例如:

  • en.json
  • cn.json

在消息文件内容写入:

{
"name": "名字",
}

在html中使用

<div>{{each.data.name | translate }}</div>

在js代码中进行翻译

$scope.name = $translate.instant("name");

@完

AngularJS国际化配置的更多相关文章

  1. AngularJS $http配置为form data 提交

    AngularJS $http配置为form data 提交 $scope.formData = {}; $http({ method: 'POST', url: '/user/', // pass ...

  2. springmvc国际化 基于请求的国际化配置

    springmvc国际化 基于请求的国际化配置 基于请求的国际化配置是指,在当前请求内,国际化配置生效,否则自动以浏览器为主. 项目结构图: 说明:properties文件中为国际化资源文件.格式相关 ...

  3. springmvc国际化 基于浏览器语言的国际化配置

    当前标签: springmvc   springmvc国际化 基于浏览器语言的国际化配置 苏若年 2013-10-09 13:03 阅读:305 评论:0   SpringMVC中应用Ajax异步通讯 ...

  4. spring MVC 使用 hibernate validator验证框架,国际化配置

    spring mvc使用hibernate validator框架可以实现的功能: 1. 注解java bean声明校验规则. 2. 添加message错误信息源实现国际化配置. 3. 结合sprin ...

  5. SpringBoot 国际化配置,SpringBoot Locale 国际化

    SpringBoot 国际化配置,SpringBoot Locale 国际化 ================================ ©Copyright 蕃薯耀 2018年3月27日 ht ...

  6. Spring MVC + Velocity实现国际化配置

    国际化介绍 web开发中,国际化是需要考虑的一个问题,而且这个问题一般是越早敲定越好(不然等到系统大了,翻译是个问题).下面是结合实际项目(Spring MVC+Velocity)对实现国际化的一些总 ...

  7. Spring Security教程(5)---- 国际化配置及UserCache

    这一章是为了给后面的讲解打基础的,主要介绍下国际化的配置及UserCache的配置及使用 国际化配置 <!-- 定义上下文返回的消息的国际化 --> <bean id="m ...

  8. Maven下Flex国际化配置

    之前写了flashbulid.initellij下的flex国际化配置,它们都是在本地打包发布的,那么我们的工程用maven管理了,需要自动发布.这时候如何修改flex的pom文件,来让它build的 ...

  9. angular项目国际化配置(ngx-translate)

    原文 https://www.jianshu.com/p/7d1da3098625 大纲 1.认识ngx-translate 2.ngx-translate的配置步骤 3.ngx-translate的 ...

随机推荐

  1. [label][IDE] Develop Node.js Project With WebStorm

    WebStorm 是一个支持 Node.js,CoffeeScript, TypeScript, Dart, Jade, Sass, LESS and Stylus 这些最新 web 开发技术的集成开 ...

  2. lucene整理3 -- 排序、过滤、分词器

    1.    排序 1.1. Sort类 public Sort() public Sort(String field) public Sort(String field,Boolean reverse ...

  3. asp.net——上传图片生成缩略图

    上传图片生成缩略图,原图和缩略图地址一样的时候缩略图会把原图覆盖掉 /// <summary> /// 生成缩略图 /// </summary> /// <param n ...

  4. c# async 事物

    上菜 async await 机制 确实便捷开发   多线程时 如何一致性如何保证呢? public async Task<ActionResult<IEnumerable<stri ...

  5. UWP多线程枚举安全的List

    最近在做windows runtime下APP开发的工作.在Service层请求返回后,往往会通过回调的形式来通知UI更新数据.多个线程操作经常出现foreach抛出异常:System.Invalid ...

  6. markdown字体或者图片居中

    1.图片居中实例: 图片居中效果: 2.文字居中实例: 文字居中效果: 你的名字

  7. 【OCP认证12c题库】CUUG 071题库考试原题及答案(27)

    27.choose two The SQL statements executed in a user session are as follows: SQL> CREATE TABLE pro ...

  8. KVM性能优化学习笔记

    本学习笔记系列都是采用CentOS6.x操作系统,KVM虚拟机的管理也是采用virsh方式,网上的很多的文章都基于ubuntu高版本内核下,KVM的一些新的特性支持更好,本文只是记录了CentOS6. ...

  9. robot framework学习笔记之八—解决列表或者字典中文乱码问题

    最近遇到字典或者列表中包含中文时,显示成u'\u的问题,如: 保存特色服务模块 ${proxy} Set Variable http://127.0.0.0:8888 ${list0} Create ...

  10. CVE-2017-11882漏洞复现

    作者:zero 漏洞信息:CVE-2017-11882 2017年11月14日,微软发布了11月份的安全补丁更新,其中比较引人关注的莫过于悄然修复了潜伏17年之久的Office远程代码执行漏洞(CVE ...