ng-disabled with index within ng-repeat angularjs - angularjs

Question

I want to disable button using ng-disabled within ng-repeat. In this case I want to make like button for every items.
I want to disable the button during http request until it return success result.
If I use $scope.btnLikeDisable = true before http request, it will block all Like button.
Here is the code.
<div ng-repeat="item in items">
<button class="button button-block icon ion-thumbsup"
ng-model="item.islike"
ng-class="item.islike== true?'button-on':'button-light'"
ng-click="changeLikeState(item.id, $index);"
ng-disabled="btnLikeDisable"> Like</button>
</div>
This is the function, when the btnLikeDisable is set to true before http then set to false when http request is done
$scope.changeLikeState = function(itemid, index) {
$scope.btnLikeDisable = true;
$http.post(Url).then(function(data) {
}).catch(function(response) {
console.log(response.data.message);
}).finally(function($) {
$scope.btnLikeDisable = false;
});
}
How to achive this so it doesnt disable all like buttons ?
So far I plan to add ng-disabled="isDisable($index)" but I am not sure how the isDisable($index) works.

Answer 1

You can initialise dummy variable for every item called btnLikeDisable
<div ng-repeat="item in items" ng-init="item.btnLikeDisable=false">
<button class="button button-block icon ion-thumbsup" ng-model="item.islike" ng-class="item.islike== true?'button-on':'button-light'" ng-click="changeLikeState(item.id, $index);" ng-disabled="item.btnLikeDisable"> Like</button>
</div>
And, function changes in this way :
$scope.changeLikeState = function(itemid, index) {
$scope.items[index].btnLikeDisable= true;
$http.post(Url).then(function(data) {
}).catch(function(response) {
console.log(response.data.message);
}).finally(function($) {
$scope.items[index].btnLikeDisable= false;
});
}