初识AngularJS
最近接触课表的APP,便结识了AngularJS. 概念AngularJS在Web应用方面是一个非常完美的JavaScript MVC框架。 MVC对于MVC我们已经很熟悉了,在Angular应用中,视图层就是DOM,控制器就是JavaScript类,模型数据存储在对象属性中。 数据绑定当程序运行的相当好是,我们想将新数据插入到界面中,或者改变基于用户输入的数据是,我们可以通过数据绑定来确保同时在界面和JavaScript属性中获取的数据是正确的状态。 依赖注入依赖注入是当我们需要某个具体的控制器或者服务时,并不直接在代码中用new操作符创建实例,而是发送请求以获取它所有的依赖关系。 指令AngularJS 通过被称为 指令 的新属性来扩展 HTML。 示例<!DOCTYPE html> <html ng-app> <head> <base/> <title>Your Shopping Cart</title> <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script> </head> <body ng-controller='CartController'> <h1>Your Order</h1> <div ng-repeat='item in items'> <span>{{item.title}}</span> <input ng-model='item.quantity'/> <span>{{item.price | currency}}</span> <span>{{item.price * item.quantity | currency}}</span> <button ng-click="remove($index)"> Remove </button> </div> <script> function CartController($scope) { ////@formatter:off $scope.items = [{ title : 'Paint pots',quantity : 8,price : 3.95 },{ title : 'Polka dots',quantity : 17,price : 12.95 },{ title : 'Pebbles',quantity : 5,price : 6.95 }]; ////@formatter:on $scope.remove = function(index) { $scope.items.splice(index,1); }; } </script> </body> </html>
(编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |