angular之控制器（0）

时间：2022-09-19 23:27:03

一、控制器的含义

在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总结控制器的三种主要职责： 为应用中的模型设置初始状态 通过&dollar;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&period;js小知识总结

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

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

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

随机推荐

  1. 3&period;Kali 1&period;0 &sol; 2&period;0 安装中文输入法（谷歌pinyin &plus; 其他）

    1.kali默认是没有中午输入法的,需要自己安装一下 2.首先我们先获取root权限 dnt@HackerKali:~$ su密码: 3.安装中文输入法(apt-get 指令不会的同学可以学习一下基础 ...

  2. 轻松理解AOP思想&lpar;面向切面编程&rpar;

    本文旨在帮助还没有理解AOP的童鞋看透弄懂AOP,也欢迎高手批评指正. 先说一个Spring是什么吧,大家都是它是一个框架,但框架这个词对新手有点抽象,以致于越解释越模糊,不过它确实是个框架的,但那是 ...

  3. PADS在注册表中的菜单栏数据

    位于 [HKCU\Software\Mentor Graphics\PADS9_5\PADS Layout\Workspaces\ENU\Default\BCGToolBar-593980] 下的二进 ...

  4. NIOS II CPU复位异常的原因及解决方案

    NIOS II CPU复位异常的原因及解决方案   近期在用nios ii做项目时,发现一个奇怪的现象,在NIOS II EDS软件中编写好的代码,烧写到芯片中,第一次能够正常运行,但是当我按下板卡上 ...

  5. 学习BFC

    BFC全称是Block Formatting Context,即块格式化上下文.它是CSS2.1规范定义的,关于CSS渲染定位的一个概念.要明白BFC到底是什么,首先来看看什么是视觉格式化模型. 视觉 ...

  6. 夯实基础之--new关键字、instanceOf原理

    1.instanceOf原理  检测右边构造函数的prototype是否在左边对象的原型链上,在返回true,不在返回false 例:function  Persion(name,age){ this ...

  7. dede列表页读取当前栏目名称

    list或者arclist之内使用[field:typename/]之外使用{dede:field name='typename'/}

  8. HDU - 4420 2013icpc长春A 函数离散化 &plus; st表

    思路:我们定义F(x) 为以x点为起点,向后(a - b)个里面有多少个白球,虽然x的范围是LL范围内的,但是白球的 个数只有1e5, 那么我们可以把连续一段相同的离散化到一起, 对于一个确定的长度为 ...

  9. 适配iOS10 调取系统打电话功能

    [[UIApplication sharedApplication] openURL:[NSURL URLWithString: [NSString stringWithFormat:@"t ...

  10. 关于同时查询父子名称的SQL查询语句的写法 id name parentId parentName &period;

    parentid是1就是id为1的公司的子公司 如图 查询出所有的信息后 由于我要呈现的是parentName 不是parentId所以想问下SQL语句怎么写 谢谢啦~~:) 解法: SELECT s ...

相关文章