可运行代码如下:

<!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的两种常见方式,

  1. Create a pipe that 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>
  1. Create a service that 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例子的更多相关文章

  1. AngularJS开发指南7:AngularJS本地化,国际化,以及兼容IE低版本浏览器

    AngularJS本地化,国际化 国际化,简写为i18n,指的是使产品快速适应不同语言和文化. 本地化,简称l10n,是指使产品在特定文化和语言市场中可用. 对开发者来说,国际化一个应用意味着将所有的 ...

  2. AngularJs学习笔记--Understanding Angular Templates

    原版地址:http://docs.angularjs.org/guide/dev_guide.mvc.understanding_model angular template是一个声明规范,与mode ...

  3. AngularJS的核心对象angular上的方法全面解析(AngularJS全局API)

    总结一下AngularJS的核心对象angular上的方法,也帮助自己学习一下平时工作中没怎么用到的方法,看能不能提高开发效率.我当前使用的Angularjs版本是1.5.5也是目前最新的稳定版本,不 ...

  4. AngularJS学习 01进入Angular世界

    Angular下载 各个版本的下载地址:https://code.angularjs.org/ 打开上述URL,页面如下图: 点击需要的版本,跳出如下页面: 点击红色框内容即可下载完整的压缩包. 还可 ...

  5. AngularJS config run 及区别和例子

    一.config方法 在模块加载阶段,对模块进行自定义配置 config可以注入$stateProvider, $urlRouterProvider, $controllerProvider, $pr ...

  6. AngularJS的简单订阅发布模式例子

    控制器之间的交互方式广播 broadcast, 发射 emit 事件 类似于 js中的事件 , 可以自己定义事件 向上传递直到 document 在AngularJs中 向上传递直到 rootScop ...

  7. angular.js 例子

    angular.js是一个前端的MVC框架,12年的时候曾近在一个portal平台的项目中使用过. 下面给出一个angular.js的典型例子,涵盖一些基础的知识点,用以复习备忘: <html ...

  8. 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 ...

  9. 【angularJS】定义模块angular.module

    模块定义了一个应用程序.控制器通常属于一个模块. JavaScript 中应避免使用全局函数.因为他们很容易被其他脚本文件覆盖. AngularJS 模块让所有函数的作用域在该模块下,避免了该问题. ...

随机推荐

  1. axios方法get及post代码示例

    show: function(){ //get方式 //赋值给变量self var self = this; var url = "hotcity.json"; axios.get ...

  2. Vue.js 是什么

    Vue.js 是什么 Vue.js(读音 /vjuː/, 类似于 view) 是一套构建用户界面的 渐进式框架.Vue 采用自底向上增量开发的设计. Vue 的核心库只关注视图层. 单页应用:Vue ...

  3. VMware vCenter 6.5 安装及群集配置介绍

    一.介绍 VMware vCenter Server 提供了一个可伸缩.可扩展的平台,为虚拟化管理奠定了基础.可集中管理VMware vSphere环境,与其他管理平台相比,极大地提高了 IT 管理员 ...

  4. script标签属性sync和defer

    <script src="a.js" defer></script> 加了defer属性script标签的页面,运行流程如下:   1.浏览器开始解析HTM ...

  5. 我的ACM技能框架(自用)

    每次接触到新的知识就把它名字记下来,留给以后当纪念 2018.11 已经学会的 滚动数组,前缀和优化 对多维数组在空间复杂度上的降维优化     最长上升子序列 LIS问题,动态规划递推解决 最长不下 ...

  6. 洛谷——P1549 棋盘问题(2)

    P1549 棋盘问题(2) 搜索||打表 #include<cstdio> #include<cstring> #include<iostream> #includ ...

  7. <MyBatis>入门五 查询的返回值处理

    select : 返回对象:  <select  id = " "  resultType= "对象的全类名"  /> List: <sele ...

  8. 阿里云创建CentOS系统设置

    1 首先设置你购买的云盘配置,例如cpu,内存,磁盘类型.容量,网络类型等 2.阿里云可以使用浏览器进行远程shell连接 首先需要输入远程密码,第一次连接的时候会提示 一定要牢记 输入密码后进入sh ...

  9. out对象的使用

    out对象的使用 制作人:全心全意 out对象用于在Web浏览器内输出信息,并且管理应用服务器上的输出缓冲区.在使用out对象输出数据时,可以对数据缓冲区进行操作,及时清除缓冲区中的残余数据,为其他的 ...

  10. 利用python去调用shell命令时候的踩到的坑

    shell中 True的返回值是0 False的返回值是1 Python中 True的返回值是1 False的返回值是0