Java之品優購課程講義_day12（8）
阿新 • • 發佈：2018-12-14
4.2 顯示 SKU 標題和價格 4.2.1 載入預設 SKU 資訊 修改 itemController.js
//載入預設 SKU
$scope.loadSku=function(){
$scope.sku=skuList[0];
$scope.specificationItems= JSON.parse(JSON.stringify($scope.sku.spec)) ;
}修改模板 item.ftl
<body ng-app="pinyougou" ng-controller="itemController" ng-init="num=1;loadSku()">
<div class="sku-name"><h4>{{sku.title}}</h4></div>
顯示價格
<div class="summary-wrap"> <div class="fl title"><i>價 格</i></div> <div class="fl price"><i>¥</i> <em>{{sku.price}}</em> <span>降價通知</span></div> </div>
4.2.1 選擇規格更新 SKU 修改 itemController.js , 編寫匹配物件的方法
//匹配兩個物件
matchObject=function(map1,map2){ for(var k in map1){
if(map1[k]!=map2[k]){ return false;
}
}
for(var k in map2){
if(map2[k]!=map1[k]){ return false;
}
}
return true;
}編寫方法，在 SKU 列表中查詢當前使用者選擇的 SKU
//查詢 SKU searchSku=function(){ for(var i=0;i<skuList.length;i++ ){ if( matchObject(skuList[i].spec ,$scope.specificationItems ) ){ $scope.sku=skuList[i]; return ; } } $scope.sku={id:0,title:'--------',price:0};//如果沒有匹配的 } 在使用者選擇規格後觸發讀取方法
//使用者選擇規格
$scope.selectSpecification=function(name,value){
$scope.specificationItems[name]=value;
searchSku();//讀取 sku
}