我想要一个按钮组作为单选按钮像这里。
我想要的是:
- 默认情况下应禁用按钮,但默认情况下应显示所有条目。
- 单选按钮行为。
我如何用我的代码实现这一点?
我的HTML:
Filter By Title:
<div class="btn-group">
<button type="button" ng-repeat="title in titles" class="btn btn-default" ng-model="selected[title]" btn-checkbox>{{title}}</button>
</div>
<table class="table table-bordered table-striped">
<thead>
<tr>
<th>Title</th>
<th>Text</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="entry in entries | filter:byTitle">
<td>{{entry.title}}</td>
<td>{{entry.text}}</td>
</tr>
</tbody>
</table>
我的JS:
App.controller('MainCtrl', function($scope, $http) {
$http.get('output/entries.json')
.then(function(res){
$scope.entries = res.data;
});
$scope.selected = {};
$scope.titles = ["sometitle","someothertitle","anothertitle"];
function isChecked(obj){
var checked = [];
for(var key in obj){
if(obj[key])
checked.push(key);
}
return checked;
};
$scope.byTitle = function(entry){
var checked = isChecked($scope.selected);
return checked.indexOf(entry.title) > -1;
};
} );
1条答案
按热度按时间wgeznvg71#
这和你想的一样吗
http://jsfiddle.net/HB7LU/278/
请注意,您的按钮需要有一个
ng-class
和一个ng-click
。ng-click
需要是一个函数调用,它设置一个作用域变量,而不是一个赋值,因为ng-repeat会创建子作用域。然后你的函数选择一个变量:
我不确定你是否想切换。如果没有: