Html 引导表行单击以打开其他选项按钮

我们有一个使用angularjs创建的表，希望为每一行添加一个编辑或删除选项。我们确实需要类似的东西，但不需要jquery

到目前为止，我们有以下几点：

 <tr ng-repeat="item in data.list | filter:searchTable track by item.sys_id" >
    <td class="moreOption">
      <div class="more" ng-click="c.showHide(item);">
        <div class='moredrop' ng-hide="!item.IsHidden">
          <ul>
            <li>
              <i class='material-icons'>edit</i>
              <span class='label'>Edit</span>
            </li>
            <li>
              <i class='material-icons'>delete</i>
              <span class='label'>Delete</span>
            </li>
          </ul>
        </div>
      </div> 
    </td>
  </tr>

---

我们真正需要解决的是显示编辑或删除的弹出框的CSS样式。我们希望它在点击时“浮动”在3个垂直点图标旁边，就像上面的代码笔链接一样，但似乎无法让它看起来像那样。此外，现在当您单击一行的3个垂直点，然后单击另一行时，将打开2个框。在客户端控制器中单击一次关闭上一个弹出框需要做什么？

为什么不使用简单的引导下拉菜单

使用您自己的按钮或图标启动带有此代码的下拉列表

$('.dropdown-toggle').dropdown()

---

您希望他们实际上必须单击以公开额外的选项，并跟踪每行的可见布尔值，以便一次在多行上保持可见还是不可见？或者，您更愿意像代码笔那样以一种巧妙的方式在行的悬停处公开它，并使用css将其保留在合成器线程（个人建议）上，而不是为每个项添加更多的观察者和另一个属性，因为添加的行越多，不可避免地会出现性能问题？

$('.dropdown-toggle').dropdown()