NativeScript/Angular - How to style checked state on a switch when using ngModel/FormBuilder?

Consider this switch:

<Switch class="switch" formControlName="answer"></Switch>


If I do this it only works when you haven't activated the switch yet, after that the background-color will always be the same even when the switch is not active:

.switch[checked=true] {
background-color: #FE4A49;
color: #FE4A49;
}


And if I do this:

.switch {
background-color: #FE4A49;
color: #FE4A49;
}


Then the background will always be the same regardless of the state.

What's the correct way of styling a switch when using it with angular's model bindings?

Continue reading...