Angular小试牛刀(最新版本)

AngularJS 是由 Miško Hevery 从 2009 年开始着手开发。
该项目目前已由 Google收购,有一个全职的开发团队继续开发和维护这个库。 已经被用于 Google Gamil, Google Docs ….等等网页中

MVVM模式小试牛刀

<!DOCTYPE html>
<!-- myApp模块 -->
<html lang="en" ng-app='myApp'>
<head>
<meta charset="UTF-8">
<title>helloworld</title>
<!-- 引入angular库 , 在head里面或者body后面都可以写 -->
<script type="text/javascript" src="js/lib/angular.js"></script>
</head>
<body>
<!-- 实例化定义的控制器 -->
<div ng-controller='MainCtrl as mainctrl'>
<!-- 调用这个对象定义的值 -->
{{mainctrl.a}}
</div>
<!-- 普通模版 -->
<h1>{{1+2}}</h1>

</body>
<script type="text/javascript" >
//创建一个angular的模块 , 数组里面表示模块的依赖 , 以后学习了ui-router等等插件, 将会写一些内容
var oMyApp= angular.module('myApp',[]);
//创建一个控制器(装饰者模式)
oMyApp.controller('MainCtrl',[function(){
alert('你好,我是控制器');
// 给实例添加一个属性
this.a = 1000;
}]);
// console.log(oMyApp);
</script>
</html>

从上面可以看出, angular的核心是在数据上, 而不是视图, 数据变了, 视图自然就变了 , angular给了世界一个惊喜 , 以上就是一个mvvm最简单的实例

(完)

分享到