一、控制器的含义

在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)的更多相关文章

  1. angular开发控制器之间的通信

    一.指令与控制器之间通信,无非是以下几种方法: 基于scope继承的方式 基于event传播的方式 service的方式(单例模式) 二.基于scope继承的方式: 最简单的让控制器之间进行通信的方法 ...

  2. Angular Js 控制器

    在Angularjs中用ng-controller指令定义了应用程序中的控制器:例如: <div ng-app="myApp" ng-controller="myC ...

  3. Angular 2 从0到1 (三)

    作者:王芃 wpcfan@gmail.com 第一节:Angular 2.0 从0到1 (一)第二节:Angular 2.0 从0到1 (二)第三节:Angular 2.0 从0到1 (三)第四节:A ...

  4. angular中控制器之间的通讯方式

    1, 利用作用域的继承方式 由于作用域的继承是基于js的原型继承方式,所以这里分为两种情况,当作用域上面的值为基本类型的时候,修改父作用域上面的值会 影响到子作用域,反之,修改子作用域只会影响子作用域 ...

  5. angular总结控制器的三种主要职责: 为应用中的模型设置初始状态 通过$scope对象把数据模型或函数行为暴露给视图 监视模型的变化,做出相应的动作

    m1.双向数据绑定: <body> <div ng-app ng-init="user.name='world'"> <h1>使用NG实现双边数 ...

  6. angular中控制器之间传递参数的方式

    在angular中,每个controller(控制器)都会有自己的$scope,通过为这个对象添加属性赋值,就可以将数据传递给模板进行渲染,每个$scope只会在自己控制器内起作用,而有时候需要用到其 ...

  7. angular input标签只能单向传递数据的问题

    angularjs input标签只能单向传递数据的问题 <ion-view title = "{{roomName}}" style = "height:90%; ...

  8. angular.js小知识总结

    angular-watch.html 代码如下: <script> var app = angular.module('app',[]); app.controller('ctrl',fu ...

  9. Angular4.0从入门到实战打造在线竞拍网站学习笔记之三--依赖注入

    Angular4.0基础知识之组件 Angular4.0基础知识之路由 依赖注入(Dependency Injection) 正常情况下,我们写的代码应该是这样子的: let product = ne ...

随机推荐

  1. windows内核 内存管理

    一.几个基本的概念 1.存储器的金字塔结构 存储器从下之上依次是磁盘/flash.DRAM(内存).L2-cache.L1-cache.寄存器,越在上面的存储器访问速度越快,同时价格也越昂贵,每一级都 ...

  2. scp使用加密算法报错unknown cipher type

    为了提高scp的传输速度指定了scp的加密算法为arcfour $ scp -c arcfour localFile userName@remoteIP:remoteFile 得到报错unknown ...

  3. DevExpress GridView加入DevExpress中的右键菜单PopuMenu

    1. 添加一个Barmanager控件 2. 加入popumenu控件,点击该控件右上角的黑色三角号,编辑选项,点击编辑的选项,选择事件,编辑事件. 3. 在使用该右键菜单的控件添加MouseUp事件 ...

  4. Vim ide for shell development

    Source : This article is part of the ongoing Vi / Vim Tips and Tricks Series. As a Linux sysadmin or ...

  5. 从清月高中物理动学课件制作工具说【FarseerPhysics引擎之WheelJoint】及【PropetryGrid之动态下拉列表】

    最近在写一个简单的小工具,可以用来制作一些简单的运动学课件,这个工具主要是把物理引擎的设置可视化,主要包括利用纹理图片直接创建并设置物体.关节等方面.之前开发时主要使用BOX2D引擎和BOX2D.XN ...

  6. Java微信公众号开发

    微信公众平台是腾讯为了让用户申请和管理微信公众账号而推出的一个web平台.微信公众账号的种类可以分为3种,并且一旦选定不可更改.按照功能的限制从小到大依次为:订阅号.服务号.企业号.个人只能注册订阅号 ...

  7. http://www.cnblogs.com/softidea/p/5631763.html

    http://www.cnblogs.com/softidea/p/5631763.html

  8. JQuery1.11版本对prop和attr接口的含义分离导致问题分析

    问题背景 实验中, 在jquery1.7版本, attr("value")  和 val() 接口获取 input 控件的值, 都是一致的, 都是当前控件值. 但是 jquery1 ...

  9. 用Unity开发HTC VIVE——移动漫游篇

    这篇文章主要写的是通过手柄控制移动在场景中漫游.在通过手柄控制移动时,我主要写了两个脚本一个ChildTransform.cs.Move.cs;1. ChildTransform这个脚本主要是为了获取 ...

  10. 友善p35屏

    友善p35 屏,x轴方向从左往右移(0——>320),Y轴方向从上往下开始(0——>240)