美文网首页我爱编程
Angular控制器是什么?

Angular控制器是什么?

作者: Meetin空白 | 来源:发表于2018-02-02 01:04 被阅读0次

大家好~  我是一枚正直纯洁的苦逼程序员!!!!

1.背景介绍

在学习angular的过程中,不同于javascript,遇到了许多新的概念,比如指令(directive)、服务(service)、控制器(controller)、模型(model)等。还接触到了MVC这种将数据管理、业务逻辑控制和数据展示分离开,进而使程序的逻辑性和可维护性更强的思想。接下来,我们会分享、讨论一下控制器的用法。

2.知识剖析

2.1什么是控制器?

Angular中的控制器,是一个常规的JavaScript对象,用于控制 AngularJS 应用程序的数据。由标准的 JavaScript 对象的构造函数创建。通常它是通过controller()方法进行声明,该方法接受两个参数,第一个为控制器名称,第二个是个匿名方法,即控制器的构造方法(函数)。

例如,它可以这样表达:

                        //一般格式,$scope 是作用域对象,是控制器与视图之间传递信息的载体。

                        var app = angular.model("app", []);

                        app.controller("loginCtrl", function($scope){

                            $scope.name = "大娃";

                            $scope.pwd = "12345";

                        })

2.2 控制器的作用域范围和继承

在html中使用ng-controller指令实例化控制器时,会产生一个新的作用域对象。在同一个页面的ng-app作用域下可以通过ng-controller实例化多个控制器对象。但是,每个控制器对应的作用域对象只能与ng-controller指令所在标签的开始与结束标签之间的DOM元素上建立数据绑定。

demo1

demo2

3.常见问题

问题: 如何在多个controller中进行信息的沟通?

4.解决方案

方法一:利用作用域继承的原理,子控制器访问父级控制器中的内容。

方法二:异步回调响应式通信—事件机制(或消息机制)。

方法三:使用service服务进行数据传输。

5.编码实战

6.扩展思考

问题: 在多个controller中进行信息的沟通还有哪些?

ngularJs项目实战: 不同controller作用域之间通信的方式

7.参考文献

参考一:AngularJs入门与进阶

参考二:Angularjs Controller 间通信机制

参考三:angular学习(三)—— Controller

参考四:AngularJS的学习--$on、$emit和$broadcast的使用

参考五:angularJS的controller之间如何正确的通信

8.更多讨论

讨论:大家对angularJs中的控制器还有哪些理解?

问题1

解决:控制器是可以嵌套的

问题2

解决:请看问题三有解答

问题三

解决不要试图去复用(嵌套)Controller,一个控制器一般只负责一小块试图

不要再Controller中操作DOM,这不是控制器的职责

不要再Controller里面做数据格式化,ng有很好用的该表单控件

不要再Controller里面做数据过滤操作,ng有$filter服务

一般来说,Controller是不会互相调用的,控制器之间的交互会通过事件进行

ppt

视频

相关文章

  • angular的知识

    Angular: MVC 分离: 基本用法: Angular特性: Angular: 控制器: Controll...

  • Angular控制器是什么?

    大家好~ 我是一枚正直纯洁的苦逼程序员!!!! 1.背景介绍 在学习angular的过程中,不同于javascri...

  • angular控制器是什么?

    一、背景介绍 AngularJS 控制器是常规的 JavaScript 对象。AngularJS 控制器 控制 A...

  • Angularjs入门(2)

    控制器 angularJS程序被控制器控制var app = angular.module("myApp",[])...

  • Angularjs入门(2)

    控制器 angularJS程序被控制器控制var app = angular.module("myApp",[])...

  • Angular基础

    表达式 在Angular中表达式是运用在视图中的一段代码,如: 控制器 在Angular中,控制器(control...

  • Angular中的控制器

    控制器在Angular中占有重要的地位,它是组成前端MVC框架的一员。在Angular中,控制器的作用是管理页面的...

  • 三大框架---angular---依

    上一章,我们理解了angular框架的各种指令,控制器,各种服务模块的调用。这个是 angular...

  • Angular模版篇

    Angular 模板 什么是模板 在 Angular 中,组件扮演着控制器或视图模型的角色,模板则扮演视图的角色。...

  • angular1.x&&ui-router页面跳转,多次执行控制

    angular1.x&&ui-router页面跳转,多次执行控制器。 做一个angular项目遇到,表示一脸懵13...

网友评论

    本文标题:Angular控制器是什么?

    本文链接:https://www.haomeiwen.com/subject/pjglzxtx.html