angualr控制器是什么?

这里是修真院前端小课堂,每篇分享文从javascript

【背景介绍】【知识剖析】【常见问题】【解决方案】【编码实战】【扩展思考】【更多讨论】【参考文献】html

八个方面深度解析前端知识/技能,本篇分享的是:前端

【angualr控制器是什么?】java

 

你们好,我是IT修真院深圳分院第11期的学员叶泽彪,一枚正直纯洁善良的WEB程序员,今天给你们分享一下,修真院官网JS任务2,深度思考中的知识点——angualr控制器是什么?程序员

 

1.背景介绍web

了解控制器以前,咱们先来了解一下什么是MVVM模式。MVVM模式是Model-View-ViewMode(模型-视图-视图模型)模式的简称。app

 

在angular中MVVM模式主要分为四部分:函数

View:它专一于界面的显示和渲染,在angular中则是包含一堆声明式Directive的视图模板。学习

ViewModel:它是View和Model的粘合体,负责View和Model的交互和协做,它负责给View提供显示的数据,以及提供了View中Command事件操做Model的途径;在angular中$scope对象充当了这个ViewModel的角色;编码

Model:它是与应用程序的业务逻辑相关的数据的封装载体,它是业务领域的对象,Model并不关心会被如何显示或操做,因此模型也不会包含任何界面显示相关的逻辑。在web页面中,大部分Model都是来自Ajax的服务端返回数据或者是全局的配置对象;而angular中的service则是封装和处理这些与Model相关的业务逻辑的场所,这类的业务服务是能够被多个Controller或者其余service复用的领域服务。

Controller:这并非MVVM模式的核心元素,但它负责ViewModel对象的初始化,它将组合一个或者多个service来获取业务领域Model放在ViewModel对象上,使得应用界面在启动加载的时候达到一种可用的状态。

 

2.知识剖析

什么是controller?AngularJS 控制器是常规的 JavaScript 对象。AngularJS 控制器 控制 AngularJS 应用程序的数据。在angularJS中,controller是一个javascript函数/类,用于操做做用域中,各个对象的初始状态以及相应的行为。

 

也就是说,在HTML中,绑定ng-controller的那个DOM节点内的全部子标签,将会是当前controller的做用域。在大型项目中,若是HTML DOM 中有多个做用域,这时你就须要知道你使用的 scope 对应的做用域是哪个。

 

angularJS中view层解析是经过controller的做用域来将$scope对象解析成相应的内容,所以咱们能够在同一个界面上划分不一样的模块,经过不一样的控制器控制不一样的模块来进行开发,这样经过划分模块的开发方式,对从此维护代码带来了便利。

 

3.常见问题

controller之间的数据该如何传输?

 

4.解决方案

使用service实现controller之间的数据传输。

controller是相对独立的,两个controller之间,内存是不共享的,同级DOM下,两个controller是没法互相访问其中的属性或者方法的。

那么,在实际项目中,咱们会有不少的页面和控制器,不一样页面下的controller之间有时候是须要传输数据的,以前咱们学习了localStorage,用于页面之间的传参,而官方建议页面之间经过service互相访问。

 

 

5.编码实战

 

 

6.扩展思考

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

1.$rootscope

$scope是html和单个controller之间的桥梁,数据绑定就靠他了。而$rootscope能够被认为是全局$scope, 在各个controller里面均可以显示,也均可以修改。

2.做用域继承

做用域嵌套带来的父子做用域的继承关系也能够算是一种父子做用域之间的通讯方式。

3.做用域继承+$watch

为了解决做用域继承不能解决的从子孙到祖先的数据传递问题,能够用$scope.$watch函数来监视数据变化。

 

7.参考文献

参考一:https://blog.csdn.net/ft63022...

参考二:https://blog.csdn.net/ft63022...

参考三:http://www.cnblogs.com/whitew...

参考四:https://blog.csdn.net/lai_xu/...

 

8.更多讨论

1.controller对应的是什么?

每个controller对应的都是本身控制的一块视图,只能够控制这个视图内的htnl元素。

2.为何有时候controller不起做用?

这个涉及的可能比较多,ng-app未定义,或者重复定义了,controller须要控制的东西在controller以外,对应的不是当前的controller。

  1. service怎么传参?

在请求里面的url里传参

 

9.今天的分享就到这里啦,欢迎你们点赞、转发、留言、拍砖~

相关文章
相关标签/搜索