如何使用controller
MVC-Controller的实现方式1
PS:玩具级的开发中可以使用,但无法应对大型项目。
MVC-Controller的实现方式2
PS:这样开发会比较清晰职责,但是如果两个控制器是一模一样的。请参照第三种方法的图2。
MVC-Controller的实现方式3
PS写一个通用控制器,然后继承它。是不推荐的。而是使用下图的service:
PS:把通用的东西写成一个服务,让控制器去调用它(而不是去继承它)。
Controller使用过程中的注意点:
- 不要试图去复用Controller,一个控制器一般只负责一小块视图。@H_403_34@
- 不要在Controller中操作DOM,这不是控制器的职责。@H_403_34@
- 不要在Controller中格式化数据,ng有很好的表单控件。@H_403_34@
- 不要在Controller里面做数据过滤,ng有$filter服务。@H_403_34@
- 一般来说Controller之间不是互相调用,控制器之间的交互会通过事件进行。@H_403_34@
如何复用Module
以上图为例:
- 页面加载完成后,以ng-app标签开始,内部所有操作由AngularJS接手。(我觉得说的有点大)@H_403_34@
- 指令ng-model = "greeting.text" 定义的是一个全局模型。在ng-app范围内可以任意使用。@H_403_34@
- model不需要手动创建,AngularJS已经做的很好了。@H_403_34@
如何复用view?
PS:
- HTML标签是<hello></hello>是View(视图)。@H_403_34@
- *.directive("标签名",function(){return {json格式} }) 设置一个标签名,以一个什么样子显示。@H_403_34@
- 在MyModule中可以随意使用指定标签。@H_403_34@
AngularJS的MVC是借助于$scope实现的!!!
$scope是分层的,像是树形的。最顶层是$rootScope
$scope的事件:
$scope的事件响应:
$scope.$on()("事件参数",function(){$scope.count++; // })
PS:当传入时间参数时(参照 $emit $broadcast ),发生function中的方法。
神奇的$scope:
- $scope是一个普通的JS对象。@H_403_34@
- $scope提供了一些工具的方法,$watch() / $apply()@H_403_34@
- $scope是表达式执行的环境,或者叫做作用域。@H_403_34@
- $scope是一个树形结构,与DOM标签平行。@H_403_34@
- 子层 $scope 去继承父$scope的属性和方法。@H_403_34@
- 每一个AngularJS应用都只有一个根 $scope 对象(一般位于ng-app)@H_403_34@
- $scope 是可以发事件的,类似DOM事件,可以向上,也可以向下。@H_403_34@
- $scope 不仅仅是MVC的基础,也是后面实现双向数据绑定的基础。@H_403_34@
- 调试,可以使用angular.element[$0].scope() 进行调试(当前元素的$scope)。@H_403_34@
$scope的生命周期:
- Creation 1、创建@H_403_34@
- Watcher registration 2、注册监控@H_403_34@
- Model mutation 3、检测模型的变化@H_403_34@
- Mutation observation 4、观察变化@H_403_34@
- Scope destruction 5、销毁Scope@H_403_34@
如果那里说的不对,请指教。
如果哪里理解偏差,请指正。
谢谢!