巴黎的妖

使用AngularJS  进行Hybrid App 开发已经有一年多时间了,这里做一个总结. 一、AngularJS 初始化加载流程 1、浏览器载入HTML，然后把它解析成DOM。2、浏览器载入angular.js脚本。3、AngularJS等到DOMContentLoaded事件触发。4、AngularJS寻找ng-app指令，这个指令指示了应用的边界

1. 基于ui-router的页面跳转传参(1) 在AngularJS的app.js中用ui-router定义路由，比如现在有两个页面，一个页面（producers.html）放置了多个producers，点击其中一个目标，页面跳转到对应的producer页，同时将producerId这个参数传过去。.state('producers', { url: '/producer

$apply()和$digest()在AngularJS中是两个核心概念，但是有时候它们又让人困惑。而为了了解AngularJS的工作方式，首先需要了解$apply()和$digest()是如何工作的。这篇文章旨在解释$apply()和$digest()是什么，以及在日常的编码中如何应用它们。 探索$apply()和$digest()AngularJS提供了一个非常酷的特性

习惯了window.onload(),$(document).ready()，现在换成别的了，还真有点不习惯了。下面说一下常用的4种情况。1，html中直接写script src="lib/angular/angular.min.js" type="text/javascript">script>script type="text/javascript"> angular.e

在实践中，常常会有数据结构一致但深度不确定的数据。而通常情况下，对数据的处理会用到递归的方式。例如网站的无限级分类的展现，分类数据结构：复制var cate = [ { cateId: 1, cateName: '前端技术', child: [ { cateId: 4,

ng-repeat渲染完成事件因为在用AngularJS期间, 经常用到ng-repeat, 而有时需要在其渲染完成时操作已经渲染的对象, 所以特在此记录一下添加渲染事件的方法, 以方便以后的使用;代码如下myApp.directive('onRepeatFinishedRender', function ($timeout) { return { restrict:

AngularJs在IE8之前版本中，会出现{{}}无法解析的现象，先记录解决方法。1、添加html5shiv.js和json2.js2、在html或body节加： ng-app="myapp"  id="ng-app" class="ng-app:myapp">源引：http://blog.youkuaiyun.com/baif911/article/details/4252

ng-bind是从$scope -> view的单向绑定ng-modle是$scope view的双向绑定在AngularJS中显示模型中的数据有两种方式：p>{{text}}p>另一种是使用基于属性的指令，叫做ng-bind：p ng-bind="text">p>主要区别在于，使用花括号语法时，在AngularJS使用数据

注：AngularJS1.3已经不支持IE8（包括IE8）以下的浏览器。更多信息请查看 我们的Blog 。AngularJS 1.2将继续支持IE8，但核心团队不会花时间去解决IE8或更早的IE浏览器问题。本文是介绍针对IE浏览器的特征来处理HTML属性和标签。如果你想在IE8或者更早的浏览器的应用中使用AngularJS的话，这篇文章非常适合你。该项目目前支持IE9+了，并会

一、What does it do?　　$location服务分析浏览器地址栏中的URL（基于window.location），让我们可以在应用中较为方便地使用URL里面的东东。在地址栏中更改URL，会响应到$location服务中，而在$location中修改URL，也会响应到地址栏中。　　$location服务：暴露当前浏览器地址栏的URL，所以我们可以1.

前言angular之所以使用起来很方便，是因为通常我们只需要在html里面引入一个或多个（自定义或内置的）指令就可以完成一个特定的功能（这也是angular推荐的方式），比如：一个简单的双向绑定（用ng-model指令）,或者模板循环渲染（用ng-repeat指令），又或者是模板是否显示（用ng-if指令）,而对于这些指令的内部实现一般我们无需太多关心（除非你想深入了解），我们更乐意于

UI-Router:为什么开发者都不喜欢Angular.js内置的路由字数5012 阅读4366 评论7 喜欢10Angular.js 是一个用来构建“富客户端”的神奇JavaScript框架。但是事实却是许多开发者却不使用其内置的路由模块。反而使用AngularUI项目的 UI-Router模块来代替之。这是因为UI-Router有两个重要的特性：多样化视图嵌

1.配置使用ui-router1.1导入js文件需要注意的是：必须导入angular.min.js这个文件，且angular.min.js必须导入在angular-ui-router.min.js前面。script type="text/javascript" src="JS/angular.min.js">script>script type="text/javascr

个人觉得，要很好的理解AngularJS的运行机制，才能尽可能避免掉到坑里面去。在这篇文章中，我将根据网上的资料和自己的理解对AngularJS的在启动后，每一步都做了些什么，做一个比较清楚详细的解析。     首先上一小段代码（index.html），结合代码我们来看看，angular一步一步都做了些什么。?1234

AngularJS的主要组成部分：    启动(startup) - 展示"hello world!"    执行期(runtime) - AngularJS 执行期概览    作用域(scope) - 视图和控制器的集合区    控制器(controller) - 应用的行为    模型(model) - 应用的数据    视图(view) - 用户能看到的    指

备注：AngularJS 1.3抛弃了对IE8的支持。可以在我们的博客上了解更多内容。AngularJS 1.2将继续支持IE8，但核心团队已经不打算在解决IE8及之前版本的问题上花时间。本文档介绍了互联网浏览器（IE）在处理自定义HTML标签及属性时的特点。如果你正计划在IE8或更早的浏览器上部署Angular应用请阅读本文。项目目前支持且将尝试修复IE9以上的bug 。持续

AngularJS $route的局限性：一个路由只能影响一个ng-view 不是所有页面只有一栏，往往有两栏或两栏以上,例如:左边的功能导航和右边的正文区或三栏布局,下图是一个大概示例 上面的图片来自:https://github.com/angular-ui/ui-router/wiki/Multiple-Named-Views对了，此文会介绍:ui-router,它弥

介绍AngularJS 嵌套路由：这是我针对同一个主题（ui-router）的第二篇文章. 如果你对第一篇文章感兴趣的话，可以访问 这里. 好了，让我们继续吧，来看看嵌套的ui-router状态是怎么回事. ui-router和同属AngularJS框架一部分的ng-route一样强大. ui-router提供了让我们可以做路由嵌套和视图命名的特性. 我们将在示例中看到ui-route

导言 stackoverflow上有一个人问了一个问题：如果我有jQuery背景，我应该如何切换到AngularJS的思维模式？ 有一个回复非常经典，获得了两千多票。 为了让国内开发者也能领略到其中的核心思想，现把这个问题和答案翻译出来供大家参考。 Question 假设我已经熟悉了如何使用jQuery来开发客户端

通常我们知道指令默认是可以跟外界通信的.比如:<div ng-controller="mytest">    test自定义指令是可以访问到mytest控制器的scope要想把test自定义指令独立作用域,也就是说跟mytest切断关系:可以加

大家知道，当scope选项写为scope:{}这种形式的时候，就已经为指令生成了隔离作用域，现在，我们来看看绑定策略的三种形式：& 、= 、@。首先是@，它将本地作用域和DOM中的属性值绑定起来（且这个属性的值必须是父级作用域中的），什么意思呢？说的简单一点就是假设你在模板中有个双花括号表达式，然后我们把表达式里的内容和html中指令里特定名字的属性绑定起来，还是不懂？看看下面的代码：

I have same problem.Problem that, when Ionic parse html, it check:if (slides.length < 2) options.continuous = false;and even if you run $ionicSlideBoxDelegate.update(); it's not help, be

angularjs 校验密码字段一致性 Js代码  directives.directive('pwCheck', function () {      return {          require: 'ngModel',          link: function (scope, elem, attrs, ctrl) {       

Angularjs  filter过滤器 uppercase，lowercase大小转换 {{ "lower cap string" | uppercase }}     //结果：LOWER CAP STRING{{ "TANK is GOOD" | lowercase }}         

1. 模态对话框 : $ionicModal模态对话框 : $ionicModal模态对话框常用来供用户进行选择或编辑，在模态对话框关闭之前，其他 的用户交互行为被阻止。在ionic中使用模态对话框有三个步骤：1.声明对话框模板使用ion-modal-view指令声明对话框模板，对话框模板通常置入 script内以构造内联模板： 2.创建对话框对

了解Promise在谈论Promise之前我们要了解一下一些额外的知识；我们知道JavaScript语言的执行环境是“单线程”，所谓单线程，就是一次只能够执行一个任务，如果有多个任务的话就要排队，前面一个任务完成后才可以继续下一个任务。这种“单线程”的好处就是实现起来比较简单，容易操作；坏处就是容易造成阻塞，因为队列中如果有一个任务耗时比较长，那么后面的任务都无法快速执行，或导

在ng-app或控制器中定义的全局变量，在不同的controller里都可以使用。1，通过var 直接定义global variable，这根纯js是一样的。2，用angularjs value来设置全局变量 。3，用angularjs constant来设置全局变量 。4，用angularjs rootscope来设置全局变量 。5、定义服务。6、$rootScope。

1、先来看一段Demo，看完这个demo你可以思考下如果使用$.ajax如何处理同样的逻辑，使用ng的promise有何优势？12345678910111213141516171819202122

1、先来看一段Demo，看完这个demo你可以思考下如果使用$.ajax如何处理同样的逻辑，使用ng的promise有何优势？12345678910111213141516171819202122

一、概要在AngularJS中，子作用域（child scope）基本上都要继承自父作用域（parent scope）。但，事无绝对，也有特例，那就是指令中scope设置项为对象时，即scope:{…}，这将会让指令创建一个并不继承自父作用域的子作用域，我们称之为隔离作用域（isolated scope）。指令中的scope一共可以有三个值，下面我们再来温习下：

ng-class是AngularJS预设的一个指令，用于动态自定义dom元素的css class name，下面是其官网的api doc， AngularJS:ngClassng-class在实际的应用场景中还是比较灵活的，而在AngularJS中一般有三种方式给元素的class属性做一些门道，如下scope变量绑定（不推荐使用）function ctr($scope){

关于自定义指令的命名，你可以随便怎么起名字都行，官方是推荐用[命名空间-指令名称]这样的方式，像ng-controller。不过你可千万不要用 ng-前缀了，防止与系统自带的指令重名。另外一个需知道的地方，指令命名时用驼峰规则，使用时用-分割各单词。如：定义myDirective，使用时 像这样：。这里列出directive的合法命名：ng:bindng-bindng_bindx-

在AngularJS的代码库中呈现出了大量有趣的设计，最有趣的两个例子是scope的工作方式和directives(指令)的表现。有的人第一次接触AngularJS时就被告知directives是和DOM交互，或供你随意操作DOM，就像jQuery. 这立马变得非常复杂，试想，scopes, directives 和controllers相互作用.复杂的设置之后，你开始学习它先进的

如果这个图表看起来非常的费解，那么这篇文章很适合你。(Image credit: Angular JS documentation) (Large version)声明: 这篇文字是基于 AngularJS v1.3.0 tree.到底什么是指令(directive)？LinkAngularJS中，指令是 通常是小的 组件， 这意味着跟DOM交互

什么是隔离 ScopeAngularJS 的 directive 默认能共享父 scope 中定义的属性，例如在模版中直接使用父 scope 中的对象和属性。通常使用这种直接共享的方式可以实现一些简单的 directive 功能。当你需要创建一个可重复使用的 directive，只是偶尔需要访问或者修改父 scope 的数据，就需要使用隔离 scope。当使用隔离 scope 的时候，di

1.一点小说明 指令的作用：实现语义化标签 我们常用的HTML标签是这样的：  一点点内容 而使用AngularJS的directive（指令）机制，我们可以实现这样的东西：  子面板1 子面板2 很多人可能要惊呼，这货和JSP或者Struts等等框架里面的taglib很像啊

第一点区别是，ng-if 在后面表达式为 true 的时候才创建这个 dom 节点，ng-show 是初始时就创建了，用display:block 和 display:none 来控制显示和不显示。第二点区别是，ng-if 会（隐式地）产生新作用域，ng-switch 、 ng-include 等会动态创建一块界面的也是如此。这样会导致，在 ng-if 中用基本变量绑定 ng-mo

常用的表单验证指令 1. 必填项验证某个表单输入是否已填写，只要在输入字段元素上添加HTML5标记required即可：  2. 最小长度验证表单输入的文本长度是否大于某个最小值，在输入字段上使用指令ng-minleng= "{number}"： 3. 最大长度验证表单输入的文本长度是否小于或等于某个最大值，在输入字段上使

input[text]input一般和ngModel结合使用来实现双向绑定，同时angular提供了很多表单校验的指令required 必填ngRequired 必填（ngRequired可以控制是否是必填校验）ngMinlength 最小长度ngMaxlength 最大长度pattern 正则匹配ngPattern 正则匹配ngChange 内容改变时触发ngTrim 是

前言如果想开发一款类似gmail的web应用，我们怎么做呢？以jQuery的思路，做响应式的架构设计时，我们要监听所有点击事件，通过事件函数触发我们加载数据，提交，弹框，验证等的功能；以 AngularJS的思路，做声明式的架构设计时，我们通过指令和路由先设定好，什么样的操作干什么事情，等事件发生时，程序就会知道该干什么了。今天说一下，AngularJS是如何实现前端路由功