CODEWITHSUNDEEP
javascripthtmlangularjstwitter-bootstrap
Deji James
Deji James

Reputation: 437

Change Buttons when Clicked

Below is my HTML code with Bootstrap and Angular:

   <button class="btn btn-secondary btn-sm" ng-click="buy(player)">{{history.indexOf(player)>=0?'REMOVE':'SELECT'}}</button>

When i click the button, the wording of the button changes from 'SELECT' to 'REMOVE'. However, what i want is the colour of the button to change so that it is the default colour when on 'SELECT' but the red "btn-danger" class when 'REMOVE'.

Is this possible?

Upvotes: 0

Views: 64

Answers (1)

Vitalii Chmovzh
Vitalii Chmovzh

Reputation: 2943

Sure! And it's really simple.

 <button class="btn btn-secondary btn-sm" ng-class="{'btn-danger': history.indexOf(player) >= 0 }" ng-click="buy(player)">{{history.indexOf(player)>=0?'REMOVE':'SELECT'}}</button>

Note ng-class directive added to the button.

Upvotes: 2

Related Questions