angular学习日志04 购物车!

来源:互联网 发布:中国馆建筑 知乎 编辑:程序博客网 时间:2024/06/05 14:30
<!DOCTYPE html>
<html lang="en" ng-app="start">
<head>
<meta charset="UTF-8">
<title>shoppingcart</title>
<script type="text/javascript" src="js/angular.min.js"></script>
</head>
<body ng-controller='CartController'>
<h1>yourOrder</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 type="text/javascript">
angular.module("start",[])
.controller('CartController',function($scope){
$scope.items=[
{title:'Paint pots',quantity:8,price:3.95},
{title:'polka',quantity:17,price:13.95},
{title:'Ppebbles',quantity:8,price:6.95}
];
$scope.remove=function(index){
$scope.items.splice(index,1);
}
})
</script>
</body>
</html>
0 0