javascript - 更改 Angular 2 组件模板内的嵌套？

Question

我有一个用户可配置的布局，我相信我需要更改每个配置的元素嵌套。我不需要多个模板，因为维护起来很麻烦，但我想知道 Angular 2 中是否有某种方法可以定义一个父元素，其子元素将显示天气，或者不显示父元素。所以如果我有:

<parent>
    <child />
</parent>

我想使用某种切换来从显示列表中删除父元素，而不丢失它的子元素。因此，关闭后，child 将成为 parent 的父级的子级。

这可能吗？

Answer 1

如果 parent只是一个 HTML 标签，这可以使用有条件应用的 CSS 类来间接完成。

例如，如果 parent是 <div> :

模板:

<span [class.myDivClass]="condition">
  <child />
</span>

CSS:

.myDivClass {
  display: block;
}

如果 parent是一个 Angular 组件，只需向其添加一个输入来禁用其功能可能会更容易，而不是尝试取消嵌套它。

或者，也可以创建一个具有这种效果的指令。