AngularJS:根据鼠标事件显示隐藏元素

时间:2013-05-14 04:54:05

标签: angularjs angularjs-directive

以下是一个示例 - http://plnkr.co/edit/iwvjJcUurUW2AvkDArfz?p=preview

我希望删除按钮仅在鼠标悬停在行上并通过传递名称执行某些功能删除(名称)时显示

我怎样才能做到这一点?

P.S我是Angular世界的新手

2 个答案:

答案 0 :(得分:10)

这可以通过CSS快速解决,无需带JS或Angular。 在我看来,使用基本的CSS会更好的解决方案。 将以下内容添加到样式表中:

 <style>
   tr i.icon-minus-sign { display: none; }
   tr:hover i.icon-minus-sign { display: block; };
 </style>

答案 1 :(得分:0)

Andres的答案很棒,但我认为很多人偶然发现这个变化:

{{1}}

在许多情况下这是更好的,因为当使用visibility:hidden时,元素仍然存在但只是不可见,因此即使没有显示它也会占用空间。这就是为什么表格和单元格在悬停在行上时不会改变大小。