Open Narutocc opened 7 years ago
angularJS可以构建一个单一页面应用程序(SPA), 是一个MVC框架:
M--model层 V--view层 C--controller层
如果angular中ng-app不写的话,可以用以下代码代替
<script src="jquery.js"></script> <script src="angular.js"></script> <script> var app = angular.module('myApp',[]); angular.bootstrap(angular.element('body')[0],['myApp']); </script>
注意:要引入jq,angular.element() === $()
MVC是一种使用 MVC(Model View Controller 模型-视图-控制器)设计模式,该模型的理念也被许多框架所吸纳,比如,后端框架(Struts、Spring MVC等)、前端框架(Angular、Backbone等)。在学习angular的过程中,我在网上查找关于angular MVC介绍的文章很少,有些文章也没有很直白地为初学者指明angular MVC到底是啥样貌,因此,今天我们就来谈谈MVC模型在angular的形态。
view view指的是视图,在web前端工程中,view往往指的是HTML代码。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href="css/bootstrap.css" type="text/css"> </head> <body ng-app="app"> <div class="col-md-4 col-md-offset-4" ng-controller="InputController"> 模型数据: <input type="text" class="text-primary" ng-model="book.title"> </div> <script src="js/angular.js"></script> <script src="js/demo1.js"></script> </body> </html>
model model指的是模型数据,在java后端开发中,我们常常使用java为业务数据单独建模,然而,在前端中,我们也可以为数据建立模型。比如,下面的代码片段。
var book = { title: "angular" }
我们为书籍建立一个数据模型对象,为了简单,我只为book声明了一个属性。 controller controller指的是控制器,它的作用是控制model与view之间的交互。
angular.module("app", ["InputModule"]); angular.module("InputModule", []) .controller("InputController", ["$scope", function ($scope) { var book = { title: "angular" } $scope.book = book; }]);
angularJS可以构建一个单一页面应用程序(SPA), 是一个MVC框架:
如果angular中ng-app不写的话,可以用以下代码代替
注意:要引入jq,angular.element() === $()
简介
MVC是一种使用 MVC(Model View Controller 模型-视图-控制器)设计模式,该模型的理念也被许多框架所吸纳,比如,后端框架(Struts、Spring MVC等)、前端框架(Angular、Backbone等)。在学习angular的过程中,我在网上查找关于angular MVC介绍的文章很少,有些文章也没有很直白地为初学者指明angular MVC到底是啥样貌,因此,今天我们就来谈谈MVC模型在angular的形态。
view view指的是视图,在web前端工程中,view往往指的是HTML代码。
model model指的是模型数据,在java后端开发中,我们常常使用java为业务数据单独建模,然而,在前端中,我们也可以为数据建立模型。比如,下面的代码片段。
我们为书籍建立一个数据模型对象,为了简单,我只为book声明了一个属性。 controller controller指的是控制器,它的作用是控制model与view之间的交互。