angularJs ng-click is not working inside the ng-if function

Question

<div ng-if="quantity > 0">
 <button ng-click="quantity = quantity-1">-</button>
</div>

Above is my code. i dont know why the ng-click doesnt work when it shows up. anyone can give me advise? thanks.

Answer 1

Angular has its own "Dot" rule.

If you keep the quantity stored in controller scope, you might try this inside controller:

$scope.myvar = {
    quantity: 2,
    decrease: function() {
        this.quantity--;
    }
}

and html

<div ng-if="myvar.quantity > 0">
 <button ng-click="myvar.decrease()">-</button>
</div>

Answer 2

Try this it will work :

<div ng-controller="MyCtrl">
  <div ng-show="quantity > 0">
    <button ng-click="quantity = quantity-1">-</button>
    <p>{{quantity}}</p>
  </div>
</div>

app.controller('MyCtrl', function($scope) {
  $scope.quantity = 6;
});

Working fiddle : http://jsfiddle.net/Lvc0u55v/8856/