嵌入式视图上下文。通过观察

Question

我有一个模板参考：

@ViewChild('myTemplate', { read: TemplateRef, static: true })
    myTemplate!: TemplateRef<unknown>;

和viewContainerRef：

@ViewChild('vcr', { read: ViewContainerRef, static: true })
    vcr!: ViewContainerRef;

然后我创建嵌入视图：

const newTemp = this.myTemplate.createEmbeddedView(
            null
            this.vcr.injector
        );

我添加上下文：

newTemp.context = {
            observ: this.subject$.pipe(
                tap(() => 
                    console.log('context passed');
                ),
            ),
        };

然后插入：

this.vcr.insert(newTemp);

我的 html 模板如下所示：

<ng-container #vcr>
</ng-container>
<ng-template #myTemplate let-observ="observ" let-data="data">
    <div>Data: {{ data }}</div>
    <div> Obs data: {{ observ | async }} </div>
</ng-template>

数据显示得很好，但订阅甚至不会触发，并且控制台中没有任何内容。 我需要在组件中传递上下文。

Answer 1

假设您正在使用

Subject

如果主题值在模板中发生订阅之前到达，则订阅主题较晚意味着错过了上一个事件

使用

BehaviourSubject

代替主语

subject$ = new BehaviorSubject('Default value');