<!doctype html>
<html lang="en" ng-app="Cartmodel">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="http://apps.bdimg.com/libs/angular.js/1.3.9/angular.min.js"></script>
</head>
<body>
<div ng-controller="CartController">
<h1>angularjs 購物車</h1>
<div ng-repeat='item in items'>
<span>{{item.title}}</span>
<input type="text" ng-model='item.num'>
<span>{{item.price|currency}}</span>
<span>{{item.price*item.num|currency}}</span>
<button ng-click="cancle($index)">刪除</button>
</div>
</div>
<script>
var Cartmodel=angular.module('Cartmodel',[]);
Cartmodel.controller('CartController',function($scope){
$scope.items=[
{title:"牛肉",num:"2",price:"20"},
{title:"羊肉",num:"3",price:"20"},
{title:"豬肉",num:"1",price:"30"}
]
$scope.cancle=function(index){
//console.log(index);
$scope.items.splice(index,1);
console.log("刪除成功");
}
});
</script>
</body>
</html>
angularJS實例之購物車
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.