How to select quantity for ng-repeat values

ionic-v1
1

how can i use counter for ng-repeat values?? . I have used a 2 functions add and minus quantity and called those function in controller. the problem is when i click add or minus the counter does increase or decrease for all the ng-repeat datas . i want to increase or decrease quantity for each and every product…can anyone post a sample code or for the screenshot below

image

controller.js

.controller('grocery', function($scope, $http) {

    $http.get('/groceryjson.json')
        .success(function(response) {
            $scope.mydata = response;
            $scope.booking = [];

            $scope.toggle = function(image) {
                $scope.selectedImage = image.product_name;
                $scope.selected_can_rate = image.can_rate;
                $scope.product_name = image.product_name;
                /* $scope.register.product_name = image.product_name;*/
                $scope.can_path = image.can_path;
                /*$scope.register.can_path = image.can_path;*/
                
                $scope.booking.push(image)

                console.log($scope.booking);
               
            };
        })

    $scope.myEvent = function() {
        window.location = "#/app/booking";
    }
    $scope.canqty = 0;

    $scope.addqty = function(no){
    $scope.canqty++
}

$scope.subqty = function(no){
    if($scope.canqty >=1){
    $scope.canqty-- 
    }

    
};
})

grocery.html

<ion-view view-title="Grocery">
    <ion-floating-button ng-click="myEvent()" has-footer="false" button-color="#2AC9AA" icon="ion-plus" iconColor="#fff">
    </ion-floating-button>
    <ion-content>
        <div class="row" ng-click="toggle(image)" ng-repeat="image in mydata">
            <div class="col col-30 grocery-img">
                <img src="{{image.can_path}}" alt="{{image.product_name}}">
            </div>
            <div class="col col-30">
                <div class="grcoery-header">
                    {{image.product_name}}
                </div>
                <!-- <div class="grocery-desc">
                    {{data.desc}}
                </div> -->
            </div>
            <div class="col col-40">
                <div class="grocery-buy">
                    <a class="button buy">Add</a>
                </div>
            </div>
        </div>
        <div class="row" ng-repeat="data in booking track by $index">
            <div class="col col-40">
                <img src="{{data.can_path}}" alt="{{data.product_name}}" style="width:100px;">
            </div>
            <div class="col col-60">
              <div class="row">
              <div class="col col-30">
                <button class="add" ng-click="addqty(no)"></button>
              </div> 
              <div class="col col-30" >
                 <div class="canqty-2">{{canqty}}</div>
              </div>
              <div class="col col-30">
                <button class="minus" ng-click="subqty(no)"></button>
              </div>
              </div>
            </div>
        </div>
</ion-content>
</ion-view>
2

<div class=“col col-30”>
<button class=“add” ng-click=“addqty(no)”></button>
</div>
<div class=“col col-30” >
<div class=“canqty-2”>{{data.canqty}}</div>
</div>
<div class=“col col-30”>
<button class=“minus” ng-click=“subqty(no)”></button>
</div>
replace this line and in your controller your code will be
$scope.addqty = function(no){
$scope.booking[no].canqty++
}