I am writing an AngularJS app and ran into an issue in combination with bootstrap's js. If I want the buttons below to act as they should (have 'active' class added when clicked and be exclusive) then I need bootstrap's JS.
<div class="btn-group" data-toggle="buttons">
<label class="btn btn-primary">
<input type="radio" value="one" ng-model="myData[$index].number"> one
</label>
<label class="btn btn-primary">
<input type="radio" value="two" ng-model="myData[$index].number"> two
</label>
</div>
The problem is, that when I use bootstrap's JS, ng-model seems to stop working and no data is shown in my variable.
However, when I remove the bootstrap's JS, ng-model works as expected but the buttons do not act as they should.
I tried replacing bootstrap.js with angular's ui bootstrap JS but with the same results. I am probably just misunderstanding the use of bootstrap's JS?
This is the expected behaviour of the buttons. When I use angularJS this doesn't work. Unfortunately bootstrap's JS requires jQuery ...
Any help appreciated,
thanks