контекст не определен после передачи его в шаблон

Question

Почему rowData не определен внутри шаблона расширения?Все в порядке, прежде чем передавать его на шаблон расширения.

<ng-template>
  <ng-container *ngTemplateOutlet="extensiontemplate; context: rowData"></ng-container>
</ng-template>

<ng-template #extensiontemplate> 
<!-- here rowData is undefined -->
</ng-template>

Answer 1

Вы должны добавить переменную rowData в шаблон, например:

<ng-template #extensiontemplate let-rowdata> 
    <!-- here rowData is undefined -->
</ng-template>

Это будет работать, если вы добавили свойство $implicit в контекст (rowData), например, ваш rowData будет выглядеть так:

rowData = {$implicit: 'row data'};

Если вы не добавили неявное свойство, вам необходимо иметь переменную со значением в качестве ключа в контексте.

Например, если ваш контекст

rowData = {somethingElse: 'row data'};

Вам нужен ваш шаблон, например:

<ng-template #extensiontemplate let-rowData="somethingElse"> 
    <!-- here rowData is undefined -->
</ng-template>

См. Эту документацию: https://angular.io/api/common/NgTemplateOutlet

Редактировать

В вашем случае извлеченный rowData, который вы передаете в другой шаблон, не имеет значения $implicit, вам нужно назначить его явно, сделайте так:

<ng-container *ngTemplateOutlet="extensiontemplate; context: rowData"></ng-container>
<ng-template let-viewDetails="vin" #extensiontemplate>
    <tr *ngIf="viewDetails">
        <td colspan="3">
            Additional row data here for VIN ID: {{viewDetails}}                  
        </td>
    </tr>
</ng-template>

Проверьте это здесь: https://stackblitz.com/edit/angular-bmq2xi?file=src/app/app.component.html