Styling selected AngularUI radio button - html

Question

Does anyone know what is the proper CSS selector for selected (:checked) AngularUI's radio button? I tried "checked", "selected", "active", but none of this does the work. I need to find a similar selector as :checked for HTML radio button.
Every useful answer / JSFiddle is highly appreciated and evaluated.
Thank you.

Answer 1

If it's styling you're after then use ng-class bound to the ng-model:
<input type="checkbox" ng-model='stuff' ng-class='{class1: stuff, class2: !stuff}'>
and add css rules for classes class1 and class2

Answer 2

Since you are using angularjs,instead of using jquery selectors like :checked or :active,you can just use the angularjs functionalities to detect the active checkbox.
<div class="form-group">
<label class="checkbox-inline">
<input type="checkbox" name="favoriteColors" ng-click="yourFunction()" ng-model="formData.favoriteColors.red"> Red
</label>
<label class="checkbox-inline">
<input type="checkbox" name="favoriteColors" ng-model="formData.favoriteColors.blue"> Blue
</label>
<label class="checkbox-inline">
<input type="checkbox" name="favoriteColors" ng-model="formData.favoriteColors.green"> Green
</label>
</div>
cosider this as your checkboxes,now in your js (ie)your controller
var formApp = angular.module('formApp', [])
.controller('formController', function($scope) {
// we will store our form data in this object
$scope.formData = {};
$scope.yourFunction = function() {
/**function to call when a checkbox with model formdata.favourite colors.red is selected **/
};
});
Notice I have include functions for only one checkbox.You can do it for each of these check boxes
You might find this fiddle useful
http://jsfiddle.net/ShinyMetilda/C9V39/
Also this example in the documentation will be usefull
https://docs.angularjs.org/api/ng/input/input%5Bcheckbox%5D