Ionic shopping cart with local storage fucntion

@cashsonu wrote:

when i add to cart the product gets added and shows 1 in cart but when i add same product again it doesn't show in cart as 2 but during check out it shows 2 for same product. Is there missing something to show in the cart icon
here is my controller.js and html file
controller.js

angular.module('starter.controllers', [])
.controller('AppCtrl', function($scope, WC, $localStorage, $rootScope, $ionicModal, $state){

  $scope.$on('$ionicView.enter', function(e) {
    console.log("userData", $localStorage.userData);
    if($localStorage.userData){
      $rootScope.userData = $localStorage.userData
    }
  });

  $scope.logout = function(){
    $localStorage.userData = undefined;
    $rootScope.userData = undefined;
  }

  $localStorage.cart = [];

  if($localStorage.cart)
    $rootScope.cartCount = $localStorage.cart.length;
  else
    $rootScope.cartCount = 0;

.controller('ProductCtrl', function($scope, WC, $stateParams, $ionicSlideBoxDelegate, $localStorage, $rootScope){

  var Woocommerce = WC.WC();

  Woocommerce.get('products/' + $stateParams.productID, function(err, data, res){
    if(err)
      console.log(err);

    $scope.product = JSON.parse(res).product;
    $scope.images = JSON.parse(res).product.images;
    console.log($scope.product);
    $scope.$apply();

    $ionicSlideBoxDelegate.update();
    $ionicSlideBoxDelegate.loop(true);


    Woocommerce.get('products/' + $stateParams.productID + '/reviews', function(error, dat, response){
      if(error)
        console.log(error);

      $scope.reviews = JSON.parse(response).product_reviews;

    })

  })

  $scope.addToCart = function(product){
    var countIncreased = false;
    $localStorage.cart.forEach(function(item, index){
      if(item.id == product.id && !countIncreased){
        console.log(item.id + "==" + product.id);
        item.count += 1;
        console.log("count increased by 1 for " + item.title);
        countIncreased = true;
      }
    });

    if(!countIncreased){
      product.count = 1;
      $localStorage.cart.push(product);
    }
    $rootScope.cartCount = $localStorage.cart.length;
  }


});

---

product.html

---

<ion-view>


    <ion-content>

        <ion-list class="list-card">
            <ion-item class="item-body">
                <ion-slide-box show-pager="true" does-continue="true" pager-click="true" auto-play="true" slide-interval="4000">
                  <ion-slide ng-repeat="img in images"><center>
                    <img ng-src="{{img.src}}" style="width:350px !important; height:350px; margin:auto; display:block" /></center>
                  </ion-slide>
                </ion-slide-box>
            </ion-item>
        </ion-list>
        <div class="list card">
            <div class="item item-body">
               <div class="row">
                    <div class="col-50">
                        <h2>{{product.title}}</h2>
                    </div>
                    <div class="col-50">
                        <button class="button button-positive button-block" ng-click="addToCart(product)">Add To Cart</button>
                    </div>
                </div>
                <p ng-bind-html="product.description"> </p>
            </div>
        </div>

        <div class="list card">
            <div class="item item-body">
                <div class="row">
                    <div class="col-50">
                        <h2>Price </h2>
                        <h2 ng-bind-html="product.price_html"></h2>
                    </div>
                    <div class="col-50">
                        <h2>Average Rating</h2>
                        <h2>{{product.average_rating}}</h2>
                    </div>
                </div>
            </div>
        </div>

        <div class="list card">
            <div class="item item-body">
                <h2>Product Specifications</h2>
                <table style="min-width:100%;">
                    <tr class="row" ng-repeat = "attribute in product.attributes">
                        <td class="col-33"><b>{{attribute.name}}</b></td>
                        <td class="col-66"><span ng-repeat = "option in attribute.options">{{option}}</span></td>
                    </tr>
                </table>
            </div>
        </div>

        <div class="list card">
            <div class="item item-body">
                <h2>Product Reviews</h2>
                <ion-list ng-repeat="review in reviews">
                    <ion-item class="item-divider">{{review.reviewer_name}}</ion-item>
                    <ion-item class="item-text-wrap">{{review.review}}</ion-item>
                </ion-list>
            </div>
        </div>


    </ion-content>
</ion-view>

Posts: 1

Participants: 1

Read full topic