I am currently working on some Angular code.
<div ng-repeat="item in items | filter:search" class="container">
<h3>{{item.name}}</h3>
<p>category:{{item.category}}</p>
<p>price:INR {{item.price}} /-</p>
<br/>
<button ng-hide="showme" ng-click="process(item.name,item.price)">Add</button>
<button ng-show="showme" class="ng-cloak">Remove</button>
</div>What I am trying to achieve is to have a functionality where clicking the add button in a specific div will hide that button and display a remove button. However, I am facing an issue where all the divs are being affected rather than just the one that was clicked.
Below is the code snippet from my controller:
var myApp = angular.module('myApp',[]);
myApp.controller('restaurantController', function($scope, $http){
$http.get('apna.json').success(function (data){
$scope.items = data;
});
$scope.showme=false;
$scope.process = function(name, value){
$scope.total = parseInt($scope.total) + parseInt(value);
$scope.showme = true;
}
});