angular - 是否可以进行深度 ng-content 选择？

Question

假设我想将这样的标记嵌入到 ng-content 中：

<div aaa>
  AAA
</div>
<div aaa bbb>
  BBB
</div>

为此，我可以使用选择器（看起来像普通的 CSS 选择器）：

<ng-content select="div[aaa]"></ng-content>
----- some other content here -----
<ng-content select="div[aaa][bbb]"></ng-content>

但是如果我有这个内容怎么办（我无法摆脱'section'标签）：

<section>
  <div aaa>
    AAA
  </div>
  <div aaa bbb>
    BBB
  </div>
</section>

我可以使用哪些选择器来获得相同的结果？这对我不起作用：

<ng-content select="section div[aaa]"></ng-content>
----- some other content here -----
<ng-content select="section div[aaa][bbb]"></ng-content>

这都不是：

<ng-content select="section>div[aaa]"></ng-content>
----- some other content here -----
<ng-content select="section>div[aaa][bbb]"></ng-content>

有什么解决方法吗？为什么选择器不能像 CSS 一样工作？这是设计使然吗？我在文档上找不到原因...

如果将 'section' 标签替换为 'ng-template' 或 'ng-container' 会有帮助吗？

score 0 · Accepted Answer

我不相信 ng-content 是可能的。

您想要做的事情有其他选择，但是它们有点复杂。

我首选的方法是使用 Angular CDK 门户。如需更多信息，请参阅：

1 回答 1