Is this along the lines of what you were thinking?
http://jsfiddle.net/HB7LU/278/
Note your button needs to have an ng-class
and an ng-click
. The ng-click
needs to be a function call that sets a scope variable rather than an assignment due to the ng-repeat, which creates child scopes.
<button
type="button"
ng-repeat="title in titles"
class="btn btn-default"
ng-model="selected[title]"
btn-checkbox
ng-class="{active: title == selectedTitle}"
ng-click="setSelectedTitle(title)">{{title}}</button>
Then your function to select a variable:
$scope.setSelectedTitle = function (value) {
if ($scope.selectedTitle === value) {
$scope.selectedTitle = undefined;
} else {
$scope.selectedTitle = value;
}
};
I wasn't sure if you wanted it to toggle, or not. If not:
$scope.setSelectedTitle = function (value) {
$scope.selectedTitle = value;
};