AngularJS 1.x 国际化——Angular-translate例子
可运行代码如下:
<!DOCTYPE html>
<html ng-app="MyApp">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="http://apps.bdimg.com/libs/angular.js/1.2.16/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-translate/2.15.1/angular-translate.js"></script>
</head>
<body>
<div>
<h1>{{ 'Hello' | translate }}</h1>
<span translate='what? A dog.'></span>
</div>
<script type="text/javascript">
var app = angular.module("MyApp",['pascalprecht.translate']); app.config(['$translateProvider',function($translateProvider){
$translateProvider.translations('en',{
'Hello':'Hello',
'what? A dog.':'what? A dog.'
}); $translateProvider.translations('zh',{
'Hello':'你好',
'what? A dog.':'神马?这是一只旺财!'
}); $translateProvider.preferredLanguage('zh');
}]);
</script>
</body>
</html>
注意:使用translate的两种常见方式,
- Create a
pipethat we can use to translate our words in the HTML view. Like this:
<!-- should display 'hola mundo' when translate to Spanish -->
<p>{{ 'hello world' | translate }}</p>
- Create a
servicethat we can use to translate our words in JS / Typescript. Like this:
...
// should display 'hola mundo' when translated to Spanish
this.translatedText = this.translate.instant('hello world'); // this.translate is our translate service
...
第二种方式方便直接在ts文件中使用!不过翻译的东西依然是在
$translateProvider.translations
里! 参考:https://scotch.io/tutorials/simple-language-translation-in-angular-2-part-1
AngularJS 1.x 国际化——Angular-translate例子的更多相关文章
- AngularJS开发指南7:AngularJS本地化,国际化,以及兼容IE低版本浏览器
AngularJS本地化,国际化 国际化,简写为i18n,指的是使产品快速适应不同语言和文化. 本地化,简称l10n,是指使产品在特定文化和语言市场中可用. 对开发者来说,国际化一个应用意味着将所有的 ...
- AngularJs学习笔记--Understanding Angular Templates
原版地址:http://docs.angularjs.org/guide/dev_guide.mvc.understanding_model angular template是一个声明规范,与mode ...
- AngularJS的核心对象angular上的方法全面解析(AngularJS全局API)
总结一下AngularJS的核心对象angular上的方法,也帮助自己学习一下平时工作中没怎么用到的方法,看能不能提高开发效率.我当前使用的Angularjs版本是1.5.5也是目前最新的稳定版本,不 ...
- AngularJS学习 01进入Angular世界
Angular下载 各个版本的下载地址:https://code.angularjs.org/ 打开上述URL,页面如下图: 点击需要的版本,跳出如下页面: 点击红色框内容即可下载完整的压缩包. 还可 ...
- AngularJS config run 及区别和例子
一.config方法 在模块加载阶段,对模块进行自定义配置 config可以注入$stateProvider, $urlRouterProvider, $controllerProvider, $pr ...
- AngularJS的简单订阅发布模式例子
控制器之间的交互方式广播 broadcast, 发射 emit 事件 类似于 js中的事件 , 可以自己定义事件 向上传递直到 document 在AngularJs中 向上传递直到 rootScop ...
- angular.js 例子
angular.js是一个前端的MVC框架,12年的时候曾近在一个portal平台的项目中使用过. 下面给出一个angular.js的典型例子,涵盖一些基础的知识点,用以复习备忘: <html ...
- angularJs中筛选功能-angular.filter-1
技术分享:http://www.ncloud.hk/%E6%8A%80%E6%9C%AF%E5%88%86%E4%BA%AB/angular-filter-learn-1/ 以下介绍为自己在使用ang ...
- 【angularJS】定义模块angular.module
模块定义了一个应用程序.控制器通常属于一个模块. JavaScript 中应避免使用全局函数.因为他们很容易被其他脚本文件覆盖. AngularJS 模块让所有函数的作用域在该模块下,避免了该问题. ...
随机推荐
- CAD删除组(网页版)
主要用到函数说明: _DMxDrawX::DeleteGroup 根据组名,删除组.详细说明如下: 参数 说明 BSTR pszName 组名 js代码实现如下: 1 2 3 4 5 6 7 8 9 ...
- vue-cli的项目加入骨架屏
在原生APP中我们经常可以看到,打开app时候,内容还没出来,app会被别的内容替代,这样很好的提升了用户体验.那么在webApp中,我们如何避免白屏的尴尬情况呢?可以通过 vue-skeleton- ...
- 06二叉树、Map、Collections、适配器
06二叉树.Map.Collections.适配器-2018/07/16 1.set集合,无索引,不可以重复,无序(存取不一致) 2.TreeSet用来对象元素进行排序,可以保证元素唯一 储存自定义对 ...
- Many Equal Substrings CodeForces - 1029A (kmp next数组应用)
题目大意 题目看样例也能猜到就是输出最短的循环串. 吐槽 明明是div3第一题为啥子还会用到kmp的知识? 解法 这个题仔细看发现是求最长可去除的后缀,也就是说去除跟下一个相同的字符串还能连接起来.这 ...
- Python学习-字符串函数操作3
字符串函数操作 isprintable():判断一个字符串中所有字符是否都是可打印字符的. 与isspace()函数很相似 如果字符串中的所有字符都是可打印的字符或字符串为空返回 True,否则返回 ...
- streamwise veloicty along the jet axis using Matlab/Octave
input file: v.csv scpirts as follows filename='v.csv'; % assign file to a variable m=csvread(filenam ...
- 1.Ubuntu查看Python版本
1.输入命令:ls -l /usr/bin/python*
- 洛谷 2921 [USACO08DEC]在农场万圣节Trick or Treat on the Farm
[题解] 就是基环外向树森林找环,然后从环向外统计size就可以了. #include<cstdio> #include<cstring> #include<algori ...
- 【Codeforces 1027D】Mouse Hunt
[链接] 我是链接,点我呀:) [题意] 题意 [题解] 先求出来强连通分量. 每个联通分量里面,显然在联通块的尽头(没有出度)放一个捕鼠夹就ok了 [代码] #include <bits/st ...
- noip模拟赛 捡金币
问题描小空正在玩一个叫做捡金币的游戏.游戏在一个被划分成 n行 n列的网格状场地中进行.每一个格子中都放着若干金币,并且金币的数量会随着时间而不断变化. 小空的任务就是在网格中移动,拾取尽量多的金币. ...