0

Below is the code for checkbox :

How to style checkbox with background color and border when checked.

<input  type="checkbox" ng-model="vehicle.selected" name="selectedVariants[]" 
value="{{vehicle.name}}" ng-checked="{{vehicle.selected}}" />
Sajal
  • 4,359
  • 1
  • 19
  • 39
ashu6767
  • 1
  • Possible duplicate of https://stackoverflow.com/questions/4148499/how-to-style-checkbox-using-css else you can also look into angular material design – brk Jul 11 '17 at 05:56
  • 1
    Possible duplicate of [How to style checkbox using CSS?](https://stackoverflow.com/questions/4148499/how-to-style-checkbox-using-css). But if you want to do it the angular way use ng-class and you shouldn't use interpolation on ng-checked – Vivz Jul 11 '17 at 06:03

1 Answers1

0

No need for angular, or any JS for that matter.

html (notice that I have added a class):

<input  type="checkbox" ng-model="vehicle.selected" name="selectedVariants[]" class="custom-class-here" 
value="{{vehicle.name}}" ng-checked="{{vehicle.selected}}" />

css:

.custom-class-here:checked {
    background-color: #123456;
    border: 1px solid #654321;
}
nadavvadan
  • 3,930
  • 1
  • 17
  • 29