angularJS制作的购物车功能

                         ~去结算~         

    

                   var m1 = angular.module("myapp", ['ngRoute']);     m1.config(['$routeProvider', function( $routeProvider ){         $routeProvider             .when("/", {                  template :                  "\                     \                         \                         

单价：

\                         数量：-\                         \                         +\                         

"             })             .when("/go_buy", {                  template :                  "\                     \                         \                         "             })     }]);     m1.controller("ctrler", ["$scope", "$timeout", function($scope, $timeout){          $scope.all_cal = { num : 0 };         $scope.arr_fruit = [ {name:"香蕉", money:5, num:1, buy:false}, {name:"苹果", money:9, num:1, buy:false}, {name:"雪梨", money:6, num:1, buy:false}, {name:"西瓜", money:10, num:1, buy:false}, {name:"火龙果", money:8, num:1, buy:false}, {name:"荔枝", money:11, num:1, buy:false}, {name:"榴莲", money:18, num:1, buy:false}, {name:"哈密瓜", money:8, num:1, buy:false} ];         //点击去结算         $scope.ifruit = $scope.arr_fruit;         $scope.oturn = true;         $scope.go_cal = function( event ){              $scope.new_arr = [];             //筛选出已加入购物车的水果             for( var i=0; i<$scope.arr_fruit.length; i++ ){                  if( $scope.arr_fruit[i].buy == true ){                      $scope.new_arr.push( $scope.arr_fruit[i] );                 }             }             if( $scope.oturn ){                 event.target.href = "#go_buy";                 event.target.innerHTML = "返回";                 setStyle( event.target, {'height':'30px', 'left':'calc(50% - 100px)', 'fontSize':'18px', 'lineHeight':'30px'} );                 setStyle( event.target.parentNode, {'width':'400px', 'borderRadius':'0', 'left':'calc(50% - 200px)'} );                 setStyle( event.target.parentNode.children[0], {'opacity':0});                 setStyle( event.target.parentNode.children[1], {'left':'calc(50% - 100px)', 'bottom':'60px'});//不知道为什么这里不能用childNodes[1]无效                 $scope.oturn = false;                 $scope.ifruit = [];             }             else{                  event.target.href = "#/";                 event.target.innerHTML = "~去结算~";                 setStyle( event.target, {'height':'50px', 'left':'550px', 'fontSize':'25px', 'lineHeight':'50px'} );                 setStyle( event.target.parentNode, {'width':'800px', 'borderRadius':'30px', 'left':'calc(50% - 400px)'} );                 setStyle( event.target.parentNode.children[1], {'left':'50px', 'bottom':'30px'});                 $scope.oturn = true;                 //设置延迟出现以防瞬移突兀                 $timeout(function(){                      $scope.ifruit = $scope.arr_fruit;                 }, 400);             }         };     }]);     m1.controller("eachCtrl", ["$scope", function($scope){         var oindex = $scope.$index;           if( $scope.arr_fruit[oindex].buy ){              $scope.li_border = "li_adds";             $scope.ocon = "取消购买";             $scope.have_click = "have_adds";         }         else{              $scope.li_border = "";             $scope.ocon = "添加到购物车";             $scope.have_click = "";         }         //点击 - 号时         $scope.oreduce = function(){              if( $scope.arr_fruit[oindex].num == 1 ){                  return;             }             $scope.arr_fruit[oindex].num = $scope.arr_fruit[oindex].num - 1;             if( $scope.arr_fruit[oindex].buy ){                  $scope.all_cal.num = $scope.all_cal.num - $scope.fruit.money ;             }         };         //点击 + 号时         $scope.oadd = function(){              if( $scope.arr_fruit[oindex].num == 99 ){                  return;             }             $scope.arr_fruit[oindex].num = $scope.arr_fruit[oindex].num + 1;             if( $scope.arr_fruit[oindex].buy ){                  $scope.all_cal.num = $scope.all_cal.num + $scope.fruit.money ;             }         };         //点击添加到购物车时         $scope.addTo = function( event ){              if( $scope.arr_fruit[oindex].buy ){                  $scope.ocon = "添加到购物车";                 $scope.all_cal.num =  $scope.all_cal.num - $scope.fruit.money * $scope.arr_fruit[oindex].num;                 $scope.arr_fruit[oindex].buy = false;                 $scope.li_border = "";                  $scope.have_click = "";             }             else{                   $scope.ocon = "取消购买";                 $scope.all_cal.num = $scope.all_cal.num + $scope.fruit.money * $scope.arr_fruit[oindex].num;                 $scope.arr_fruit[oindex].buy = true;                 $scope.li_border = "li_adds";                 $scope.have_click = "have_adds";             }         };     }]);     function setStyle( obj, json ){          for( attr in json ){              obj.style[attr] = json[attr];         }     }