Angular 5等待createEmbeddedView呈现

时间:2018-01-12 08:44:15

标签: angular typescript

我正在尝试将一个组件的templateRef渲染到另一个组件的ng-container中。

目标组件使用templateRef接收对方法showTemplate的调用,我想渲染它并在显示之后对其进行进一步修改,即从模板滚动到任意元素。

目标组件如下所示:

export class OverlayComponent {
  embeddedViewRef: EmbeddedViewRef<any>;
  @ViewChild('mntPageOverlayContainer', {read: ViewContainerRef}) container: ViewContainerRef;

  showTemplate(value: TemplateRef<any>, props?: OverlayProps) {
    this.embeddedViewRef = this.container.createEmbeddedView(value);

    if (props && props.onShow) {
      this.embeddedViewRef.rootNodes.forEach(element => [make modifications to it]);
    }
  }

html模板包含以下元素:

<ul>
  <li *ngFor="let m of months">
    <a (click)="selectMonth(m)" [ngClass]="{'selected': m === month}">{{monthNameFor(m)}}</a>
  </li>
</ul>

我希望能够在整个模板呈现之后调用props.onShow(element),以便我可以对其进行进一步修改。特别是,我想滚动查看<li>与css类selected

但似乎发生的事情是Angular调用我的代码之后只添加了模板的根元素,而不是整个子树。只有<ul>元素可用,模板中的<li>元素将在稍后呈现。

0 个答案:

没有答案