AngularJS—理解AngularMVC模式【转】

MVC指的是 Model View Controller 模型-视图-控制器设计模式，下面通过一个简单例子来理解Angular MVC模式。

MVC指的是 Model View Controller 模型-视图-控制器设计模式，在前端中，我们可以简单的理解为：

V-View，视图层，一般是我们的html文件层，用于展示数据内容。

C-Controller，控制器，控制器帮助将M层数据给V,或者当View层数据有所改变时，通知M层，M层数据也做相应的改变。

M-Model，模型，当我们需要使用到数据的时候，数据暂存在这里。如var str="hello",或者从数据库中取出数据之后，将数据赋给一个对象或者变量，都可以理解为数据模型。

代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>理解angular的MVC模式</title>
    <script type="text/javascript" src="../libs/angular.min.js"></script>
</head>
<body ng-app="myapp">
    <!-- V-M -->
    请输入姓名：<input type="text" ng-model="name"><br>
    输入的内容是：<span>{{name}}</span>

    <!-- M-V-C -->
    <div ng-controller="MyCtrl">
        <p>{{msg}}</p>
    </div>

    <script type="text/javascript">
        angular.module("myapp",[])
        .controller("MyCtrl",function($scope){
            $scope.msg="hello angular！";
        });
    </script>
    
</body>
</html>

运行效果：

一张图理解一下这个小例子的MVC模式的使用：

转自：http://blog.csdn.net/nongweiyilady/article/details/53572028

AngularJS—理解AngularMVC模式【转】

推荐阅读