AngularJS本地化,国际化 国际化,简写为i18n,指的是使产品快速适应不同语言和文化. 本地化,简称l10n,是指使产品在特定文化和语言市场中可用. 对开发者来说,国际化一个应用意味着将所有的文字和其他因地区而异的数据从应用中抽离出来. 本地化意味着为这些抽离的数据和文字提供翻译和转变成本地的格式. 目前,AngularJS支持日期,数字和货币的国际化和本地化. 另外,AngularJS还通过ngPluralize指令支持本地多元化. 所有的AngularJS本地化组件都依赖于$loca…
原版地址:http://docs.angularjs.org/guide/dev_guide.mvc.understanding_model angular template是一个声明规范,与model.controller的信息一起,渲染成用户在浏览器中所看到的视图.它是静态的DOM,包括HTML.CSS.angular特别的元素和angular指定的元素属性.angular元素和属性指示angular去扩展行为以及将template DOM转换为动态视图的DOM. 下面是我们可以在templ…
总结一下AngularJS的核心对象angular上的方法,也帮助自己学习一下平时工作中没怎么用到的方法,看能不能提高开发效率.我当前使用的Angularjs版本是1.5.5也是目前最新的稳定版本,不过在全局API上,版本不同也没什么区别. AngularJS 全局 API列表 element bootstrap copy extend merge equals forEach noop bind toJson fromJson identity isUndefined isDefined is…
可运行代码如下: <!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…
Angular下载 各个版本的下载地址:https://code.angularjs.org/ 打开上述URL,页面如下图: 点击需要的版本,跳出如下页面: 点击红色框内容即可下载完整的压缩包. 还可以通过通过Npm包管理工具,或者Bower获取,这里暂不涉及. 简单例子开始Angular之旅 代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"&…
一.config方法 在模块加载阶段,对模块进行自定义配置 config可以注入$stateProvider, $urlRouterProvider, $controllerProvider, $provide, $httpProvider等等provider, config的工作流程: 新建一个模块,这个模块中有一个服务,一个自定义指令 var app = angular.module("myApp", []); app.fatory('myFactory',function(){…
控制器之间的交互方式广播 broadcast, 发射 emit 事件 类似于 js中的事件 , 可以自己定义事件 向上传递直到 document 在AngularJs中 向上传递直到 rootScope 观察者模式, 订阅发布模式 类似于js中的事件机制 订阅者.on('xx发布博客', function([内容]){ 通知我, 接收到博客的[内容] }) 发布者.emit('xxx发布博客', {内容}) 优点: 业务和实际触发者分离, 代码维护性相对好 缺点: 代码复杂性更高 Angular…
angular.js是一个前端的MVC框架,12年的时候曾近在一个portal平台的项目中使用过. 下面给出一个angular.js的典型例子,涵盖一些基础的知识点,用以复习备忘: <html ng-app = "myapp" > <head> <script src="angular.js"></script> </head> <!--ng-controller 定义body内使用该控制器 --&g…
技术分享:http://www.ncloud.hk/%E6%8A%80%E6%9C%AF%E5%88%86%E4%BA%AB/angular-filter-learn-1/ 以下介绍为自己在使用angular-filter时,简单总结的用法. 开始 1.你可以使用4中不同的方法来安装angular-filter: 克隆或创建这个存储库 通过bower:通过在你的终端执行:$ bower install angular-filter 通过npm:通过在你的终端执行:$ npm install an…
模块定义了一个应用程序.控制器通常属于一个模块. JavaScript 中应避免使用全局函数.因为他们很容易被其他脚本文件覆盖. AngularJS 模块让所有函数的作用域在该模块下,避免了该问题.  简单的定义一个Angular模块(module) var app = angular.module("myApp", []); 这种方法带有两个参数,一个是模板名,一个是依赖注入列表[该模块所依赖的模块],数组为空,表示当前注册的模板不需要依赖关系. 如果依赖不为空,则要保证其依赖的模块…
用一周多的时间做了一个简易的wap站 之前研究过webpack但是一直没用过,这次公司要做一个h5网站,正好拿来练练手,话说angular1x对移动端不是很友好,但主要是angular1x比较熟悉,上手快,开发也快,就没去考虑其他前端mvc框架. 好了webpack出了中文版以后,对于我们这些英语不是很好的来说真的是太棒了,话说angularjs啥时候也出个中文文档就更好了,webpack官网:https://doc.webpack-china.org/ 右上角可以选择语言. 开始之前先看一下目…
Directives have dependencies too, and you can use dependency injection to provide services for your directives to use. Bad: If you want to use <alert> in another controller or page, you have to modify the AlertService. This might break things. <!…
https://cloud.google.com/translate/v2/pricing google translate 一百万个字是$20,如果少过就得付$10,完全没有免费哦- 每天limit是2百万,也就是说全世界平均是2百万翻译,如果要增加到50M,还得打给他们...也就是说翻译没有超过50M就是$20 网页的翻译是免费的,还可以添加追踪代码(google console api) https://translate.google.com/manager/website/add ht…
ANGULAR三宗罪之版本陷阱 坑!碰到个大坑,前面由于绑定日期时将angular版本换为angular-1.3.0-beta.1时,后来午睡后,登录系统,发现无论如何都登陆不进去了,经过调试,发现数据视图已经无法实现双向绑定了.自己还以为又碰到了"僵尸程序"了呢,对比药店端的程序发现并没有什么不同之处.后来自己经过一番思索才隐约感觉到是不是angular的版本造成的,将版本换为之前的1.3.0.14,发现居然神奇般的可以了.自己这才恍然大悟:这就是一个坑啊!按照常理解释的话,angu…
addClass()-为每个匹配的元素添加指定的样式类名 after()-在匹配元素集合中的每个元素后面插入参数所指定的内容,作为其兄弟节点 append()-在每个匹配元素里面的末尾处插入参数内容 attr() - 获取匹配的元素集合中的第一个元素的属性的值 bind() - 为一个元素绑定一个事件处理程序 children() - 获得匹配元素集合中每个元素的子元素,选择器选择性筛选 clone()-创建一个匹配的元素集合的深度拷贝副本 contents()-获得匹配元素集合中每个元素的子元…
首先要有Angular的插件:然后才开始遍历 :<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript" src="js/angular.min.js"></script>…
解析: 首先,rem是以html为基准. 一般的,各大主流浏览器的font-size默认值为16px,此时1rem=16px.如果此时将rem与px进行换算很麻烦,比如0.75rem=12px. 为了更方便的进行换算(比如1:10),就可以加样式: html,body{ font-size: 62.5%; } 设置了62.5%以后就有 1rem=10px,便于用rem指定元素的尺寸(比如1.2rem=12px,1.4rem=14px),这样响应式的时候就可以直接改变font-size而无需计算其…
前言 利用H5项目第一版本已经上线,话说有了第一期就有了第二期,这不要为第二期做准备了,老大发话第一件事就要利用Angular JS实现项目的国际化以及后续要借助这个框架来实现其他功能,好吧我表示没怎么接触过,这一个礼拜自己也对Angular基本的用法已经有了初步的了解以及熟悉,于是乎就有了这篇文章的产生.其实没我什么事,我也是主动请缨说交给我,因为年底了嘛,也没什么事,不急不忙的,一天也乐得清闲,还不给自己找点事做,而且还能在做的过程中能学到东西,何乐而不为呢!Angular已盛行一时,但请恕…
写在前面 在项目中,有用到国际化,跟着就了解了下使用angularjs实现的国际化,这里做一下记录. 系列文章 [Angularjs]ng-select和ng-options [Angularjs]ng-show和ng-hide [Angularjs]视图和路由(一) [Angularjs]视图和路由(二) [Angularjs]视图和路由(三) [Angularjs]视图和路由(四) [Angularjs]ng-class,ng-class-even,ng-class-odd [Angular…
angular的例子: <!DOCTYPE html> <html ng-app="APP"> <head> <meta charset="UTF-8"> <script src="http://cdn.bootcss.com/angular.js/1.3.0-beta.12/angular.min.js"></script> </head> <body n…
2016.1.22,对大多数人来说,这是一个非常平常的日子,但这却是我决定在博客园写博客的日子.虽然注册博客园的博客已有4年8个月,却一直没有动手写过一篇博客,原因是觉得自己水平不行,写不出好东西,所以干脆就不写.现在我觉得这样想是不对的,每个人都有一个成长的过程,从学徒到能独立完成任务,再到师傅,再到专家.我想记录这个过程,并且通过写博客养成总结的好习惯,构建自己的知识体系,同时锻炼自己的写作能力. 真正接触编程是在大一下学期(2010年初)学的C语言,而接触前端则是在大一结束后的暑假(201…
Victor Savkin 大神撰写了一系列文章详细介绍如何升级 AngularJS 应用: NgUpgrade in Depth Upgrade Shell Two Approaches to Upgrading Angular Applications Managing Routers and URL Lazy Loading AngularJS Applications 深入理解 NgUpgrade 原理 Angular 应用由组件树构成,每个组件都拥有一个 注入器,并且应用的每个 NgM…
学习angular的插件写法和制作; <!DOCTYPE html> <html ng-app="APP"> <head> <meta charset="UTF-8"> <title>angular-refresh example</title> <script src="http://cdn.bootcss.com/angular.js/1.3.0-beta.12/angula…
When you implement a search bar, the user can make several different queries in a row. With a Promise based implementation, the displayed result would be what the longest promise returns. This is the problem which we want to solve. <!DOCTYPE html> &…
1. 原生事件中调用angular方法, 比如 input的onChange事件想调用angular里面定义的方法 - onChange="angular.element(this).scope().uploadPhoto(this)" <div class="col-md-2"> <input onChange="angular.element(this).scope().uploadPhoto(this)" type=&qu…
Note: Can use $dirty to check whether user has intracted with the form: https://docs.angularjs.org/api/ng/type/form.FormController Read More: http://www.yearofmoo.com/2014/05/how-to-use-ngmessages-in-angularjs.html https://egghead.io/lessons/angularj…
AngularJS 1.3 add $submitted for form, so you can use  $submitted  to track whether the submit event is trggered. Read More: https://egghead.io/lessons/angularjs-new-in-angular-1-3-updates-to-forms <!DOCTYPE html> <html> <head> <scrip…
getterSetter:  boolean value which determines whether or not to treat functions bound to ngModel as getters/setters to have greater control over your model. allowInvalid: boolean value which indicateds that the model can be set with values that did n…
原版地址:http://code.angularjs.org/1.0.2/docs/guide/i18n 一.I18n and L10n in AngularJS 1. 什么是I18n和L10n? 国际化(Internationalization),简称I18n,是让产品开发在一个他们可以简单地对产品进行语言.文化的本地化的方法的规范.本地化(Localization),简称L10n,一个使得应用.文本有适应特殊的文化或者语言市场的能力的规范.对于应用开发者,使一个程序国际化,意味着需要从程序中…
前言 这一节我们来讲讲AngularJS中的路由以及利用AngularJS在WebAPi中进行CRUD.下面我们一起来看看. 话题 当我们需要进行路由映射时即用到$route服务,在AngularJS中依赖于ngRoute模块,所以鉴于此我们得添加这个模块.添加路由服务则会映射URL到对应的视图名称,通过$location.path方法匹配到映射的视图时,视图会进行加载并呈现.在$route服务中使用映射则通过provider即$routeProvider,该服务的第一个参数是通过URL需要应用…