0

我有一个组件,它有一个需要有条件地出现在父组件内的辅助模板,我想将该子组件的数据传递回其父组件。

我正在使用ngTemplateOutlet它,除了将数据传递回父级之外,我可以做所有我需要的事情,我正在使用服务来做到这一点,但我想知道是否可以让模板携带它让父母可以通过某种绑定从那里访问它吗?

在此处输入图像描述

页面 + 顶部栏 (1) 来自父组件,如您所见,第二个组件分为 2,顶部仅在我需要父母知道的特定条件下出现,因此它隐藏其内容并显示改为子模板

组件 2 模板:

<ng-template #bbutton>
  <a (click)="bingo()>do it</a>
</ng-template>

组件 2 ts:

@viewChild('bbutton', {static: false}) bbutton: TemplateRef<any>;

Promise.resolve().then()( => this.parentCompoenet.setButtonTemplate(this.bbutton));

组件 1 模板:

<ng-container *ngTemplateOutlet="bbutton"></ng-container>

组件 1 ts:

bbutton: any;
setButtonTemplate(template: TemplateRef<any>){
  this.bbutton = template;
}

更新 当前方法的另一个问题是使这里的子组件趋向于父组件,我不希望这样,因为该子组件需要成为另一个组件的子组件。所以我需要一种方法来传递这些模板,而不会将两者捆绑在一起。

4

0 回答 0