如何在angular中显示按钮点击时不受欢迎的复选框

How to show non-popular checkboxes on button click in angular?

本文关键字：不受欢迎 复选框 按钮 angular 显示      更新时间：2023-09-26

在一个表单中，我有一个大约15个复选框的列表，其中3个是最受欢迎的。默认情况下，我只想显示3个热门选项。在3个复选框的末尾应该有一个图标来展开和折叠其余的复选框。

我正在用Angular构建网站，所以我想我可以简单地使用ng-show来实现这一点。问题是我不知道这样做是否正确。在我看来，这是一件很常见的事情，应该有某种标准的方法来做这件事…?

人们通常用什么样的图标呢?对于扩展和收缩，我通常会使用灰色小三角形，但我觉得它不适合这种特殊情况。我知道我以前在其他形式中见过，但我就是找不到灵感了。

欢迎所有提示!

我在我的应用程序中使用ng-show用于类似的目的，它工作得很好。我在控制器中设置默认值，然后使ng-click事件触发切换。

控制器:

$scope.expanded = false;
Html: 

<div ng-show="!expanded">
  <span class="glyphicon glyphicon-triangle-bottom" title="Expand"  ng-click="expanded=true">
</div>
<div ng-show="expanded">
  <span class="glyphicon glyphicon-triangle-top" title="Collapse" ng-click="expanded=false">
</div>

至于图标，我喜欢使用bootstrap字形图标。glyphicon glyphicon-triangle-top和glyphicon glyphicon-triangle-bottom以及glyphicon glyphicon-plus-sign和glyphicon glyphicon-minus-sign有利于收缩/膨胀。

相关文章：