【angular学习（四）-- Controller】的更多相关文章

angular学习(二):Controller定义总结

上文中总结完了ng-view的应用,将运维后台分开界面到2个,进行到 逻辑Controller处理中,本文将总结一下在项目中Controller都用到了哪些知识: $scope:作用域对象,仅仅是代表本Controller对象,本作用域的不论什么对象都用$scope来声明. $rootScope:代表整个页面作用域,能够在随意子$scope之间传递全局对象 $http:用来发送http请求的对象. 设置header var module =angular.module('index'); //设…

angular学习（四）-- Controller

1.4 控制器:Controller ng 中的控制器用来对 scope 进行操作 包括初始化数据和定义事件响应函数等 ng 用来解耦业务逻辑层和视图层的关键 controller 操作 scope,View 则展现 scope 的内容 传统前端程序中大量复杂的 DOM 操作逻辑都被转变成对 scope 的操作 定义控制器的三种方式 定义控制器可以有三种方式,注意第一种已经被淘汰. 第一种:传统方式,使用全局函数定义控制器: function DemoCtrl($scope) { // code…

angular学习笔记(三十)-指令(10)-require和controller

本篇介绍指令的最后两个属性,require和controller 当一个指令需要和父元素指令进行通信的时候,它们就会用到这两个属性,什么意思还是要看栗子: html: <outer‐directive> <inner‐directive></inner‐directive> </outer‐directive> 这里有两个指令,一个outer-directive指令元素,它里面又有一个inner-directive指令元素. js: app.directiv…

Angular 学习笔记（四）

作用域和控制器的交互情况: 1.控制器通过作用域对模板暴露一些方法供其调用 2.控制器中定义的一些方法可改变注册在作用域下的数据模型 3.控制器在某些场合可能需设置监听器来监听作用域中的数据模型:这些监听器在控制器的相关方法被调用时立即执行 注:用 $watch 进行脏值检查时,一定不要做任何的 DOM 操作,因为 DOM 操作拖慢甚至是拖垮整体性能的能力比在 JavaScript 对象上做属性操作高好几个数量级!! Angular 中对作用域进行脏值检查实时跟踪数据模型的变化是一个非常频繁的操…

angular学习笔记(三十一)-$location(1)

本篇介绍angular中的$location服务的基本用法,下一篇介绍它的复杂的用法. $location服务的主要作用是用于获取当前url以及改变当前的url,并且存入历史记录. 一. 获取url的相关方法: 以 'http://localhost/$location/21.1%20$location.html#/foo?name=bunny#myhash' 这个路径为例: 1. 获取当前完整的url路径: $location.absUrl():// http://localhost/$loc…

angular学习笔记04 理论加实践

scope: 布尔型或对象(默认为false) ,为true时继承父作用域并创建一个新的作用域隔离作用域具有隔离作用域的指令最主要的使用场景是创建可复用的组件, 组件可以在未知上下文中使用,并且可以避免污染所处的外部作用域或不经意地污染内部作用域.创建具有隔离作用域的指令需要将 scope 属性设置为一个空对象 {} .如果这样做了,指令的模板就无法访问外部作用域了: App.directive('myDirective', function() { return { restrict: 'A'…

angular学习笔记(三十一)-$location(2)

之前已经介绍了$location服务的基本用法:angular学习笔记(三十一)-$location(1). 这篇是上一篇的进阶,介绍$location的配置,兼容各版本浏览器,等. *注意,这里介绍的是基于angular-1.3.2版本的,低版本的$location可能会有问题. hashbang模式和history api创建单页应用 首先,$location是用在单页应用里的...(废话,angular就是用在单页的)...所以,$location处理的是url改变,但是不刷新页面的情况.…

angular学习笔记(三十)-指令(7)-compile和link(2)

继续上一篇:angular学习笔记(三十)-指令(7)-compile和link(1) 上一篇讲了compile函数的基本概念,接下来详细讲解compile和link的执行顺序. 看一段三个指令嵌套的代码: html: <body> <div ng-controller="compileCtrl"> <level-one> <level-two> <level-three> hello,{{name}} </level-…

angular学习笔记(三十)-指令(6)-transclude()方法(又称linker()方法)-模拟ng-repeat指令

在angular学习笔记(三十)-指令(4)-transclude文章的末尾提到了,如果在指令中需要反复使用被嵌套的那一坨,需要使用transclude()方法. 在angular学习笔记(三十)-指令(5)-link文章也提到了link函数的第五个参数linker. 这篇文章就来讲解一下transclude()方法(linker()方法),是怎么使用的,另外,它也是compile函数的第三个参数,用法一样. 下面就通过自己写一个简易的模拟ngRepeat的指令cbRepeat,来了解linke…

angular学习笔记(三十)-指令(5)-link

这篇主要介绍angular指令中的link属性: link:function(scope,iEle,iAttrs,ctrl,linker){ .... } link属性值为一个函数,这个函数有五个参数:scope,iEle,iAttrs,ctrl,linker scope:指令所在的作用域,这个scope和指令定义的scope是一致的.至于指令的scope,会在讲解scope属性的时候详细解释 iEle:指令元素的jqLite封装.(也就是说iEle可以调用angular封装的简版jq的方法和属…