Why don't I get variable in template?-CodePudding

I try to pass variable filteredValues to template patternTemplate:

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

Template is:

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

Why I can not get {{ filteredValues | json }} inside template?

CodePudding user response：

Change your code to this

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

Explanation:

<ng-container *ngTemplateOutlet="tmplate; context: { x : y }">
...
<ng-template #tmplate let-z="x">
  {{ z | json }}
</ng-template>

in above x is the one you use like let-z=x, and y is the value you want to bind, and z is the name you can reference in your template

CodePudding user response：

You are close. You either have to specify $implicit context or name your values passed into template context.

Either

<ng-container *ngTemplateOutlet="patternTemplate; context: {$implicit:filteredValues}">
<ng-template #patternTemplate let-passedValues> <- passedValues = filteredValues

or name your param

<ng-container *ngTemplateOutlet="patternTemplate; context: {yourName:filteredValues}">
<ng-template #patternTemplate let-passedValues="yourName"> <- passedValues = filteredValues as it will be assigned trough "yourName"

$implicit cant be mixed with other proprty names and all will work, eg

<ng-container *ngTemplateOutlet="patternTemplate; context: {$implicit:"val1",somethingElse:"somethingElseValue"}">
<ng-template #patternTemplate let-comesAsImplicit let-comesWithName="somethingElse">

{{comeAsImplicit}} will evaluate to "val1" and {{comesWithName}} evaluates to "somethingElseValue" </ng-template>