MVC模式（以angularjs为例）
1.何为MVC模式
- Model 模型数据：在ng中定义的一些变量
- View 视图：通过ng指令和表达式增强版的html
- ontroller 控制器：负责数据的增删改查的
MVC的工作原理：
View视图 接收用户的输入，通过控制器（Controller）当中的方法，完成对于Model的增删改查的操作。
数据绑定：将数据和视图绑定起来，一旦数据被修改了，视图就会更新
angular四大特征：
①采用了MVC的设计模式
Model 模型数据
View 视图
Controller 控制器
MVC的工作原理：
View视图 接收用户的输入，通过控制器（Controller）当中的方法，完成对于Model的增删改查的操作。
数据绑定：将数据和视图绑定起来，一旦数据被修改了，视图就会更新
②双向数据绑定
数据-》视图
视图用户的输入 -》 数据
③依赖注入
④模块化设计
2.MVC的好处:
在实现大型应用程序，可以通过将视图和数据隔离开，有效的降低代码的复杂度、耦合度
3：在ng中应该怎么做才能实现一个SPA？
①创建一个模块
因为在ng中是以模块为基本单位的
var app = angular.module(‘模块的名称’，[‘依赖模块1’,’依赖模块2’])
如： var app = angular.module('myModule',['ng']);
②使用模块
采用ngApp指令：一般写在html或者body
如：
③创建一个控制器
app.controller(‘控制器的名称’,function(){})
第二个参数是控制器被调用时，要执行的方法
④调用控制器
采用ngController指令来调用控制器
<div ng-controller='控制器的名称'>div>⑤实现数据的创建和显示等：
操作数据、显示出来
值得注意的是：
① scope
绑定事件的时候，在ng的做法：
<any ng-eventName="handle()"> <button
> ng-click="handleClick()"></button>
如：点击事件 ng-click="handle()"下面享上一个demo
<html ng-app="myApp">
<head lang="en"><meta charset="UTF-8"><script src="js/angular.js">script><title>title>
head>
<body>
<div ng-controller="myCtrl"><p>{{number}}p>
div><script>//1、模块的创建//注意事项：module方法的第二个参数是一个有模块名称字符串所构成的数组var app = angular.module('myApp',['ng']);//2、调用模块//借助于ngApp//3、创建控制器app.controller('myCtrl', function ($scope) {console.log('myCtrl 指定的方法被调用了!');//定义一个Model模型数据//$scope是建立数据和视图的桥梁，// 并不能直接拿来用，可以在控制器的处理函数中// 的形参中指定$scope,然后就可以用了$scope.number = 10;});//4、调用控制器// ngController
script>body>
html>本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！