angularjs data binding to button not working

Question

I'm new with AngularJS, found this binding to radio button in documentation (http://docs.angularjs.org/api/ng.directive:ngValue) and then tried to change it to button but then it doesn't work anymore ?!

It is a very simple selector, when you select radio button it displays what you've selected, but when you click the same button it doesn't do anything.

VIEW:

<input type="radio" ng-model="selected.0" ng-value="item" ng-repeat="item in items" for="{{item}}">{{ item }}

<input type="button" ng-model="selected.0" ng-value="item" ng-repeat="item in items" for="{{item}}" >

<br>selected: {{selected.0}}

CONTROLLER:

$scope.items = ['settings', 'home', 'other'];
$scope.selected = [''];

Answer 1

For the button input, you can just get rid of the ng-model and using ng-click to set the item value simply like:

ng-click = "selected.0=item"

Working example in jsFiddle

Answer 2

I tried to implement the functionality you asked by moving ng-repeat directives to outer elements. I also used ng-click directives on buttons. Here's a working example.