无意中看到anytao的项目，工作台，使用了Angularjs框架，感觉在前端表现上用户体验比较好，于是就简单看了一下，原来使用很简单，或者说，人家把代码封装的很好，以至于开发人员调用时比较简单，呵呵，使用Angularjs必须将你的html标记进行标识一下，告诉人家，我要用Angularjs来渲染页面了，事实上，Angularjs带合我们最重要的不是页面表现上，而是数据绑定上，它使ＨＴＭＬ标记不那么死板，下面看一个ＤＥＭＯ就会明白了。
下面是一个页面元素绑定的例子
<html lang="en" ng-app> <body> <div ng-controller="Ctrl"> Enter name: <input type="text" ng-model="name"><br> Hello <span ng-bind="name"></span>! </div> </body> </html> //对应的ＪＳ代码如下： function Ctrl($scope) { $scope.name = 'Whirled'; }
如果不希望改变页面的html标记，也可以手动为Angularjs初始化，代码如下：
angular.element(document).ready(function () { angular.bootstrap(document); });
而且Angularjs支持对象模型，你可以很方便的使用面向对象的特性
看下面例子，是有一个对象user,user有name和last两个属性
<div ng-controller="Ctrl3"> User name: <input type="text" name="userName" ng-model="user.name" required> Last name: <input type="text" name="lastName" ng-model="user.last"> <p> 你输入的内容为： user.name:<span ng-bind="user.name"></span> user.last:<span ng-bind="user.last"></span> </p> </div> //对应的ＪＳ代码如下： function Ctrl3($scope) { $scope.user = { name: 'zhang', last: 'zhanling' }; }
对于Angularjs的引用可以直接使用下面的地址：
URL:http://code.angularjs.org/1.2.3/angular.min.js <script src="http://code.angularjs.org/1.2.3/angular.min.js"></script>
对于Angularjs的ＡＰＩ请查看
http://docs.angularjs.org/
本文转自博客园张占岭（仓储大叔）的博客，原文链接：JS框架~Angularjs，如需转载请自行联系原博主。
