在指令之外操作AngularJS中的DOM？

这说明了AngularJS在某些HTML元素（特别是表re:--这就是为什么ui.bootstrap.collapse也不能处理表）上存在的问题

从plunkr中可以看到，我可以很好地隐藏和删除静态行，但是通过

ng repeat

生成的行不起作用。使用

ng transclude

也不能解决这个问题，因为浏览器会重新排序节点，或者删除没有正确根元素的节点

我想做的核心是在表中创建可扩展的行。每个扩展都是一个相当复杂的表结构，其中包括嵌套的ng重复

我知道我可以用表格样式重写我的tables div，或者尝试为扩展表格创建一个指令，但基本上要做到这一点似乎需要做很多额外的工作：

<tr onclick="$('#exp').toggle()">
  <td>1</td>
</tr>
<tr id='exp'>
   <td>2</td>
</tr> 

1.
2.

那么，有没有一种替代的、惯用的、有角度的方法来设置onclick处理程序，而不需要所有这些麻烦，或者我只是说“”，然后在我的html中连接一个onclick。

您可以使用ng hide（或ng show）来实现简单的隐藏和显示布尔逻辑。要在“单击”行上应用自定义类，可以使用ng类：

<table>
  <tr ng-click='hideRow2 = !hideRow2' ng-class="{active: !hideRow2}">
    <td>1</td>
  </tr>
  <tr ng-hide="hideRow2">
    <td>2</td>
  </tr>
  <tr ng-click='hideRow4 = !hideRow4' ng-class="{false: 'active', true: 'default'}[hideRow4]">
    <td>3</td>
  </tr>
  <tr ng-hide="hideRow4">
    <td ng-repeat='e in els'>{{e}}</td>
  </tr>
</table>

1.
2.
3.
{{e}}

---

使用ng hide（）有什么问题？现在我似乎有点愚蠢：）。接下来的问题，我想应用CSS样式的基础上点击以及。因此，不仅要显示隐藏行，还要更改所单击行的样式。

ng class

以进行拯救。这显示了两种不同的方法（

ng class=“{active:！hideRow2}”

或

ng class=“{false:'active'，true:'default'}[hideRow4]”用于两个特定的类）。请注意将它们作为一个答案：）