javascript - angularjs指令，jquery类选择器不起作用

我有一个角度指令，显示一个树状视图。当单击li图标时，应该隐藏嵌套的UL。

以下是重要的代码：（这在click函数中，其中e是click事件）

$toggler=$(e.target).closest('li');
if($toggler.hasClass("collapsed")){
 $toggler.removeClass("collapsed").addClass("expanded");
} else {
  $toggler.removeClass("expanded").addClass("collapsed");
}
$(".collapsed").find("ul").hide();
$(".expanded").find("ul").show();

我可以在调试器中看到该类已被正确分配和删除。但是，它仅适用于最初将类设置为折叠的第一组LI。树的更深层次显示了类更改，但选择器无法使用它们。有趣的是，当您单击较深的行时，其行为就像您第一次单击根行一样。之后，它什么也不做。

问题：为什么我的选择器不起作用？

这是我的朋克：http://plnkr.co/edit/GZ5MZjkir4AaNQmHIxFP?p=preview

最佳答案

问题是您先应用.collapsed，然后应用.expanded。因此，如果扩展了根，则孩子总是会扩展。如果交换它们，则它的工作原理如预期：

$(".expanded").find("ul").show();
$(".collapsed").find("ul").hide();

因此，它首先扩展了所有子级。然后到达第一个.collapsed子项，将其折叠。此后继续崩溃的.collapsed儿童没有视觉差异。