我有一个ng-options选择列表,我希望它是一个显示所有选项的默认选项;当您单击列表中的项目时,它应该在您单击默认值时进行过滤,它应显示所有值。我可以在过去发誓我能够使用一个选项html元素,其值设置为"",但这不起作用,有人可以帮我解决这个问题。小提琴下面。
<select ng-model="todoFilter" ng-options="todo.name as todo.name for todo in todos" class='form-control'>
<option value="">Choose Vendor</option>
</select>
<ul class="unstyled">
<li ng-repeat="todo in todos | filter:{name: todoFilter}">
{{todo.name}}
</li>
</ul>
感谢
答案 0 :(得分:1)
@mrust是对的,但在您的情况下,您可以使用简单的search
逻辑作为示例提供
<div ng-init="friends = [{name:'John', phone:'555-1276'},
{name:'Mary', phone:'800-BIG-MARY'},
{name:'Mike', phone:'555-4321'},
{name:'Adam', phone:'555-5678'},
{name:'Julie', phone:'555-8765'},
{name:'Juliette', phone:'555-5678'}]"></div>
<label>Search: <input ng-model="searchText"></label>
<table id="searchTextResults">
<tr><th>Name</th><th>Phone</th></tr>
<tr ng-repeat="friend in friends | filter:searchText">
<td>{{friend.name}}</td>
<td>{{friend.phone}}</td>
</tr>
</table>
<hr>
此代码对于了解如何使用默认过滤器
按一个或多个字段组织搜索更为重要<label>Any: <input ng-model="search.$"></label> <br>
<label>Name only <input ng-model="search.name"></label><br>
<label>Phone only <input ng-model="search.phone"></label><br>
<label>Equality <input type="checkbox" ng-model="strict"></label><br>
<table id="searchObjResults">
<tr><th>Name</th><th>Phone</th></tr>
<tr ng-repeat="friendObj in friends | filter:search:strict">
<td>{{friendObj.name}}</td>
<td>{{friendObj.phone}}</td>
</tr>
</table>
祝你好运
叶戈尔
答案 1 :(得分:0)
您可以创建自定义过滤器来处理此问题。以上帖子中的示例如下:https://stackoverflow.com/a/27118166/643779
答案 2 :(得分:0)
您的问题是您的默认选项值被解释为null
因此,在我看来,解决问题的简便方法就是在过滤器中添加监视功能,并在未定义时将其转换为空字符串。
$scope.$watch('todoFilter', function(val){
$scope.todoFilter = $scope.todoFilter? $scope.todoFilter : "";
});