Question

我正在尝试使用NgTemplateOutlet为节点树创建一个递归组件。

我被困在需要传递到顶层组件的html才能显示在递归组件中的部分。

我将递归部分基于this article和this StackBlitz example。

app.component.html

<wt-nested-list [nodes]="topNodeTree">
  <div *nestedListNode="let node">
    <h1>{{ node.nodeName }}</h1>
  </div>
</wt-nested-list>

nested-list.component.html

<div class="wt-nested-list">

<ng-container *ngFor="let node of nodes">
  <!-- node -->
  <div class="wt-nested-list__node">
    <ng-container *ngTemplateOutlet="nodeTemplate; context: {$implicit: node}"></ng-container>
    <!-- child nodes of node -->
    <ng-container *ngIf="node.children">
      <wt-nested-list>
        ???
      </wt-nested-list>
    </ng-container>
  </div>
</ng-container>

</div>

如何将 app.component.html 中的自定义html（<div *nestedListNode= ...etc）嵌入到 wt-nested-list.component中的递归部分中.html ？（由 ??? 表示）

这是一个www.stackblitz.com示例，可能有助于解释我的问题 https://stackblitz.com/edit/angular-wt9f4x

Answer 1

我将通过定义将为嵌套组件传递的可选return redirect()->back()->with('success', sprintf('Image was successfully updated.'))->with('info', sprintf('Please confirm your email.'));属性来解决此问题：

nested-list.component.ts

@Input

现在，在模板中，我们需要确保至少存在以下模板之一：

nested-list.component.html

class NestedListComponent {

  @Input() template: TemplateRef<any>;

  @ContentChild( NestedListNodeDirective, { read: TemplateRef } ) nodeTemplate;

Stackblitz Example

将“内容投影”传递到递归NGTemplateOutlet组件中？

1 个答案: