清除ui中的选定选项-选择角度
清除ui中的选定选项-选择角度
提问于 2014-10-16 02:26:54
有人知道如何在angular中清除ui选择框的选定值吗？
我想要select2的功能，你在选择框中有一个小x。看起来它没有select2得到的allow-clear方法。
回答 3
Stack Overflow用户
回答已采纳
发布于 2015-05-13 10:13:14
如果您使用的是select2主题，那么在ui-select-match指令中有一个allow-clear选项可以为您完成此操作。您将在右侧看到x，您可以通过单击它来清除它。https://github.com/angular-ui/ui-select/wiki/ui-select-match
快速示例：
<ui-select-match allow-clear="true" placeholder="Select or search a country in the list...">
<span>{{$select.selected.name}}</span>
</ui-select-match>工作示例：http://plnkr.co/edit/DbbUE68QlNLjx97pBZ56?p=preview
无论是使用引导还是选择主题，这目前都不起作用。
Stack Overflow用户
发布于 2014-11-23 03:02:45
您可以在显示所选内容时添加一个小X按钮。
<ui-select-match placeholder="Select or search a country in the list...">
<span>{{$select.selected.name}}</span>
<button class="clear" ng-click="clear($event)">X</button>
</ui-select-match>然后停止单击事件，并触发打开事件。并通过覆盖选定的模型来清除该字段。
$scope.clear = function($event) {
$event.stopPropagation();
$scope.country.selected = undefined;
};这是plnkr。http://plnkr.co/edit/qY7MbR
Stack Overflow用户
发布于 2015-02-25 17:15:25
如果你使用的是bootstrap，从设计的角度来看，你也可以使用一个fa-remove图标。
此外，从可用性的角度来看，您可能想要将删除图标与左侧对齐。
JS：
<ui-select-match placeholder="Select or find...">
<button class="clear-btn" ng-click="clear($event)">
<span class="fa fa-remove"></span>
</button>
<span class="clear-btn-offset">{{$select.selected}}</span>
</ui-select-match>CSS：
.select2 .clear-btn {
background: none;
border: none;
cursor: pointer;
padding: 5px 10px;
position: absolute;
left: -2px;
top: 1px;
}
.clear-btn-offset {
position: absolute;
left: 25px;
}在指令代码中：
$scope.clear = function($event) {
$event.stopPropagation();
// Replace the following line with the proper variable
$scope.country.selected = undefined;
};页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/26389542
复制相关文章
相似问题