bootstrap Label type=checkbox not setting on scope

1
votes

Using angular.

I have a label with type=checkbox and class=btn btn-default. I have set ng-model="{{vurd.vurderinger}}" and set ng-true-value="HO" and ng-false-value="".

<label type="checkbox" class="btn btn-default"  ng-model="vurd.VurderingsUdfaldId" ng-true-value="'HO'" ng-false-value="''">OK</label>

It is not setting the $scope = vurd.VurderingsUdfaldId to true or false value when clicking. Is there anything about bootstrap label+input type i'm not getting?

The following example is working but is not they way i want the button to look like : 

<input type="checkbox" ng-model="vurd.VurderingsUdfaldId" ng-true-value="'BO'" ng-false-value="''" />
2
angularjstwitter-bootstrap

2 Answers

0
votes

You still need to have an input type of checkbox.. not a label with type of checkbox. Do one of these alternatives work for you?

http://plnkr.co/edit/9CbR5z6EQMBDsjIgNGh9?p=preview

The first option shows the checkbox:

<label><input type="checkbox" class="btn btn-default"  ng-model="vurd.VurderingsUdfaldId" ng-true-value="'HO'" ng-false-value="''"/>OK</label>

The second option hides the checkbox, but is still functional:

<label><input ng-hide="true" type="checkbox" class="btn btn-default"  ng-model="vurd.VurderingsUdfaldId" ng-true-value="'HO'" ng-false-value="''"/>OK</label>
0
votes

From all the documentation I have read ng-true-value only works for input checkbox. You could do some ng-if logic and use a function to set the value yourself but the build in ng-true-value won't work.