1. 定义

  控制器(Controller)在AngularJS中作用是增强视图(View),AngularJS控制器是一个构造方法,用来向视图(View)中添加额外功能。

  ng-controller指令定义AngularJS应用程序控制器。

  控制器是JavaScript对象,由标准的JavaScript对象的构造函数创建。

  当控制器通过ng-controller指令被添加到DOM页面时,AngularJS会通过控制器构造函数生成一个对象。

  在生成构造函数对象过程中,$scope对象作为参数注入其中,并允许访问$scope对象。

  通过$scope对象与页面中的元素进行数据绑定,实现数据从控制器(Controller)到视图(View)的过程。$scope对象可以看作是由控制器(Controller)封装后的ViewModel。

<div ng-app="myApp" ng-controller="myCtrl">

ng-controller="myCtrl" 属性【div标签的一个属性】是一个 AngularJS 指令。用于定义一个控制器。myCtrl 函数是一个 JavaScript 函数。

<div ng-app="myApp" ng-controller="myCtrl">
名: <input type="text" ng-model="firstName"><br>
姓: <input type="text" ng-model="lastName"><br>
<br>
姓名: {{firstName + " " + lastName}}
</div> <script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.firstName = "John";
$scope.lastName = "Doe";
});
</script>

控制器在作用域中创建了两个属性(firstName 和lastName)。还可以创建函数。

ng-model 指令 绑定输入域到控制器的属性(firstName 和 lastName)。

2、controller参数含义

Eg:var app = angular.module('app',['ngPlugin']);

app.controller('frontTourism',['$scope','$http','stModal','$timeout','ngSubmit','alert',function(){/*省略*/}])

第一个参数:控制器名称

第二个参数:模块注入,引入你需要用到的其他模块【js文件】。比如$http就是一个模块。只有注入这些对象,function中才能使用。

$scope 页面传值需要 ,$http http请求需要

一个对象通常有三种方式可以获得对其依赖的控制权: 
(1) 在内部创建依赖; 
(2) 通过全局变量进行引用; 
(3)在需要的地方通过参数进行传递。 
Angular的依赖注入是通过第三种方式实现的。其余两种方式会带来各种问题,例如污染全局作用域,使隔离变得异常困难等。
从功能上看,依赖注入会事先自动查找依赖关系,并将注入目标告知被依赖的资源,这样就可以在目标需要时立即将资源注入进去。

Angular有3种注入方式:
a、推断式注入
app.controller('MyCtrl', function($scope) { 
});

b、标注式注入
var myFunc=function($scope) { 
});
myFunc.$inject = ['$scope'];
app.controller('MyCtrl',myFunc);

c、内联注入
app.controller('MyCtrl', ['$scope', function($scope) {
}]);

第1种是根据写的参数名称,如$scope,内部自己调用$inject把$scope进行依赖注入,如果在前端开发中使用压缩工具,就会把$scope变成另外的字母了,就无法进行推断了,而另外两种方式你可以把function($scope)改成function(a)都没关系;
第2种要多写一行代码;
一般推荐使用第3种。

一个页面一个控制器,,各个控制器中相同的部分放在service中,各控制器去调用。

【angularJS】Controller控制器的更多相关文章

  1. AngularJs(五)从Controller控制器谈谈$scope作用域

    大纲 用于简单示例和简单应用的controller 应用 多个controller应用的作用域问题 controller继承作用域问题 Controller的创建 AngularJs controll ...

  2. .NET/ASP.NET MVC Controller 控制器(IController控制器的创建过程)

    阅读目录: 1.开篇介绍 2.ASP.NETMVC IControllerFactory 控制器工厂接口 3.ASP.NETMVC DefaultControllerFactory 默认控制器工厂 4 ...

  3. .NET/ASP.NET MVC Controller 控制器(深入解析控制器运行原理)

    阅读目录: 1.开篇介绍 2.ASP.NETMVC Controller 控制器的入口(Controller的执行流程) 3.ASP.NETMVC Controller 控制器的入口(Controll ...

  4. MVC(Model(模型) View(视图) Controller(控制器))

    复习 1.      商品表 增删改查 index.php  add.php   view.php   edit.php   action.php 2.      MVC(Model(模型)  Vie ...

  5. Angularjs Controller 间通信机制

    在Angularjs开发一些经验总结随笔中提到我们需要按照业务却分angular controller,避免过大无所不能的上帝controller,我们把controller分离开了,但是有时候我们需 ...

  6. 【转】Angularjs Controller 间通信机制

    在Angularjs开发一些经验总结随笔中提到我们需要按照业务却分angular controller,避免过大无所不能的上帝controller,我们把controller分离开了,但是有时候我们需 ...

  7. (十六)JQuery Ready和angularJS controller的运行顺序问题

    项目中使用了JQuery和AngularJS框架,近期定位一个问题,原因就是JQuery Ready写在了angularJS controller之前,导致JQuery选择器无法选中须要的元素(由于a ...

  8. 三、ASP.NET MVC Controller 控制器(二:IController控制器的创建过程)

    阅读目录: 1.开篇介绍 2.ASP.NETMVC IControllerFactory 控制器工厂接口 3.ASP.NETMVC DefaultControllerFactory 默认控制器工厂 4 ...

  9. 二、ASP.NET MVC Controller 控制器(一:深入解析控制器运行原理)

    阅读目录: 1.开篇介绍 2.ASP.NETMVC Controller 控制器的入口(Controller的执行流程) 3.ASP.NETMVC Controller 控制器的入口(Controll ...

  10. loadrunner入门篇-Controller控制器

    Controller组件是LR的控制中心,主要包括场景设计和场景执行两部分.在VuGen中编辑完脚本并将脚本加载到Controller组件中,即开始对脚本运行时的场景进行设计,当场景设计完成后,即可执 ...

随机推荐

  1. i++为什么是线程不安全的

    主要是因为i++这个操作不是原子性的,它会编译成 i = i +1: 其实是做了3个步骤,一个是读取,修改,写入 .所以会出现多线程访问冲突问题. 可以结合Java内存模型来进行说明.

  2. CentOS开端口问题

    关闭SELINUX ##查看SELINUX状态 /usr/sbin/sestatus -v getenforce #修改config配置文件,重启后即可 vi /etc/selinux/config ...

  3. HDU-4123-树形dp+rmq+尺取

    Bob’s Race Time Limit: 5000/2000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total ...

  4. 普通for循环遍历LinkedList弊端

    java开发过程中,用到的最多的List集合就属ArrayList与LinkedList.对于ArrayList的遍历,通常是下面的方法: public static void main(String ...

  5. Django 中设置分页页码,只显示当前页以及左右两页

    设置后的效果如下: Django 给我们提供了分页的功能:`Paginator`和`Page`类都是用来做分页的.他们在Django中的路径为:`from django.core.paginator ...

  6. 【2018 “百度之星”程序设计大赛 - 初赛(B)-1004】p1m2(迷之二分)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=6383 题目就是让你求一个整数数组,在进行任意元素 + 1. - 2 操作后,请问在所有可能达到的稳定数 ...

  7. 通过ping 主机名,或者主机名对应的IP地址

    通过ping 主机名,或者主机名对应的IP地址: 如下图: 懵了吧? 但是你用 ping 主机名 -4

  8. 剑指offer--44.两个链表的第一个公共结点

    @selfboot 牛逼的代码,长度相同,一遍出结果, 长度不同,短的点跑完,变成长的,当长的跑完变成短的链表的时候,较长的链表已经走过了多的结点. ------------------------- ...

  9. .net的session详解

    http://blog.csdn.net/justin_wkf/article/details/5746914#comments

  10. React 与 可视化

    一般会想到 canvas 和 svg ; svg更适合画图, 但由于cavans在移动端的良好兼容性, 使用的更广; 什么是svg, scalable vector graphics  全称 可缩放矢 ...