I'm wondering how I can assign a class to the parent div
of each radio button in a group?
You can find the code below and view the corresponding JSFiddle here.
Here is the HTML:
<div class="bd"> <input type="radio" ng-model="value" value="foo" ng-change='newValue(value)'></div>
<div class="bd active"><input type="radio" ng-model="value" value="bar" ng-change='newValue(value)'></div>
<div class="bd"><input type="radio" ng-model="value" value="baz" ng-change='newValue(value)'> </div>
<hr>
</div>
And here is the JS:
var myApp = angular.module('myApp',[]);
function MyCtrl($scope) {
$scope.value= 'foo';
$scope.newValue = function(value) {
console.log(value);
}
}
Finally, the CSS:
.bd {
border:1px solid red;
width:100px;
float:left;
}
.active{
border:1px solid green;
}