angular之控制器（0）
一、控制器的含义
在angularJS中，controlle是一个javascript函数/类，用于操作作用域中，各个对象的初始状态以及相应的行为
二、控制器的作用
1. 控制 AngularJS 应用程序的数据
2.对$scope对象进行初始化（可以理解为每个控制器都对应一个$scope，每个控制器里面的$scope都是互相封闭的，互不影响。。除了嵌套控制器。留在以后讲$scope的作用域）
三、控制器的意义
通过控制器实现代码的业务逻辑代码。
注意：控制器的设计出发点是封装单个视图的业务逻辑，因此，不要进行以下操作：
- DOM操作 应当将DOM操作使用指令/directive进行封装。
- 变换输出形式 应当使用过滤器/filter对输出显示进行转化。
- 跨控制器共享代码 对于需要复用的基础代码，应当使用服务/service进行封装
四、控制器的一次性
控制器仅在AngularJS对HTML文档进行编译时被执行一次。从这个角度看， 就更容易理解为何将控制器称为对scope对象的增强：一旦控制器创建完毕，就意味着scope对象上的业务模型构造完毕，此后就不再需要控制器了- scope对象接管了一切。
ps:理论是为了更好的理解代码。而不是纯粹的光看。多说无益，亮代码吧！
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>控制器演示</title>
</head>
<body>
<div ng-app="myApp" ng-controller="myCtrol">
{{ name }}
</div>
<script type="text/javascript" src="js/angular.js"></script>
<script type="text/javascript">
//定义一个名称为myApp的angular的模块对象app
var app = angular.module('myApp',[]);
//通过这个模块对象app创建一个控制器。后面通过数组的方式写法是避免代码压缩存在的问题。
//（代码开始写的时候最好使用这种方式。有的人说小项目就不压缩，那小项目还用毛的angular呀，jQuery都能搞定。）
app.controller('myCtrol',['$scope',function($scope){
$scope.name = "cygnet";
}]); //扩展知识点，其实除了装逼也没有什么卵用
var version = angular.version;
console.log("当前angular的主版本号：" +version.major);
console.log("当前angular的次版本号：" +version.minor);
console.log("当前angular的小版本号：" +version.dot);
console.log("当前angular的代码名称：" +version.codeName);
console.log("当前angular的版本号：" +version.full);
</script>
</body>
</html>
angular之控制器（0）的更多相关文章
- angular开发控制器之间的通信
一.指令与控制器之间通信,无非是以下几种方法: 基于scope继承的方式 基于event传播的方式 service的方式(单例模式) 二.基于scope继承的方式: 最简单的让控制器之间进行通信的方法 ...
- Angular Js 控制器
在Angularjs中用ng-controller指令定义了应用程序中的控制器:例如: <div ng-app="myApp" ng-controller="myC ...
- Angular 2 从0到1 （三）
作者:王芃 wpcfan@gmail.com 第一节:Angular 2.0 从0到1 (一)第二节:Angular 2.0 从0到1 (二)第三节:Angular 2.0 从0到1 (三)第四节:A ...
- angular中控制器之间的通讯方式
1, 利用作用域的继承方式 由于作用域的继承是基于js的原型继承方式,所以这里分为两种情况,当作用域上面的值为基本类型的时候,修改父作用域上面的值会 影响到子作用域,反之,修改子作用域只会影响子作用域 ...
- angular总结控制器的三种主要职责： 为应用中的模型设置初始状态 通过$scope对象把数据模型或函数行为暴露给视图 监视模型的变化，做出相应的动作
m1.双向数据绑定: <body> <div ng-app ng-init="user.name='world'"> <h1>使用NG实现双边数 ...
- angular中控制器之间传递参数的方式
在angular中,每个controller(控制器)都会有自己的$scope,通过为这个对象添加属性赋值,就可以将数据传递给模板进行渲染,每个$scope只会在自己控制器内起作用,而有时候需要用到其 ...
- angular input标签只能单向传递数据的问题
angularjs input标签只能单向传递数据的问题 <ion-view title = "{{roomName}}" style = "height:90%; ...
- angular.js小知识总结
angular-watch.html 代码如下: <script> var app = angular.module('app',[]); app.controller('ctrl',fu ...
- Angular4.0从入门到实战打造在线竞拍网站学习笔记之三--依赖注入
Angular4.0基础知识之组件 Angular4.0基础知识之路由 依赖注入(Dependency Injection) 正常情况下,我们写的代码应该是这样子的: let product = ne ...
随机推荐
- BizTalk开发系列(二十一) Mapping 扩展开发
BizTalk Map编辑器提供了常用的功能块,比如数据库,字符串,数字计算等功能.可在设计Map时直接使用这些功能块进行扩展.除此之外对于进行复杂的Map处 理,Map 编辑器提供了扩展XSLT,扩 ...
- 初探XML
1.XML是什么? XML 指可扩展标记语言(EXtensible Markup Language) XML 是一种标记语言,很类似 HTML XML 的设计宗旨是传输数据,而非显示数据 XML 标签 ...
- 读过的laravel文章
Laravel 中使用 JWT(Json Web Token) 实现基于API的用户认证 http://www.tuicool.com/articles/IRJnaa api token https: ...
- 理解Bitcode
用Xcode 7 beta 3在真机(iOS 8.3)上运行一下我们的工程,结果发现工程编译不过.看了下问题,报的是以下错误: 1 ld: ‘/Users/**/Framework/SDKs/Poly ...
- ngrok 外网访问小能手
以前在学校的时候想把自己做的网站发布让外网访问,可是又没有虚拟服务器和域名就显得异常的麻烦,曾经试过花生壳映射,效果虽然还不错,但是略显麻烦.今天找到一个更方便的小工具--ngrok ! 简单的介绍一 ...
- 《Linux内核分析》第三周 构建一个简单的Linux系统MenuOS
[刘蔚然 原创作品转载请注明出处 <Linux内核分析>MOOC课程http://mooc.study.163.com/course/USTC-1000029000] WEEK THREE ...
- ExtJs 使用点滴 十三 在FormPanel 嵌入按钮
Ext.onReady(function () { //初始化标签中的Ext:Qtip属性. Ext.QuickTips.init(); Ext.form.Field.prototype.msgTar ...
- 问题 “No mapping found for HTTP request with URI [/rbiz4/uploadFile.html]” 的解决
从以前的SpringMVC项目简化一下做个例子,结果出现了下面的错误: No mapping found for HTTP request with URI [/rbiz4/uploadFile.ht ...
- 白话学习MVC(五)Controller的激活
一.概述 在此系列开篇的时候介绍了MVC的生命周期 , 对于请求的处理,都是将相应的类的方法注册到HttpApplication事件中,通过事件的依次执行从而完成对请求的处理.对于MVC来说,请求是先 ...
- Android 线程的正确使用姿势
进程优先级(Process Priority) 线程寄宿在进程当中,线程的生命周期直接被进程所影响,而进程的存活又和其优先级直接相关.在处理进程优先级的时候,大部分人靠直觉都能知道前台进程(Foreg ...