为什么使用ngTemplateOutlet时模板内无法获取传入的filteredValues变量

问题原因 #

• Angular 的 *ngTemplateOutlet 指令的 context 参数仅接收键值对格式的对象作为入参，模板中let-变量名="键名"的语法，是从context对象中读取对应键名的值，赋值给模板内部的变量。
• 你当前直接将filteredValues变量作为context传入，如果filteredValues本身不是包含filteredValues属性的对象，模板就无法匹配到对应键的值，自然无法正常输出。

解决方案 #

方案1：保持模板定义不变，调整传入的context结构 #

调用模板时将目标变量包裹在对象中，显式声明filteredValues键即可：

<ng-container *ngTemplateOutlet="patternTemplate; context: { filteredValues: filteredValues }"> </ng-container>

方案2：使用默认值传值简化代码 #

如果仅需要传递单个参数，也可以使用Angular context内置的$implicit默认键：
调用代码调整为：

<ng-container *ngTemplateOutlet="patternTemplate; context: { $implicit: filteredValues }"> </ng-container>

对应的模板定义可以省略键名声明，直接接收默认值：

<ng-template #patternTemplate let-filteredValues>
   {{ filteredValues | json }}
</ng-template>

内容的提问来源于stack exchange，提问作者user14514318