angular2将数据从[ngTemplateOutlet]返回到< template>. [英] angular2 feeding data back to `<template>` from `[ngTemplateOutlet]`

问题描述

所以我有一个带有<template>

的组件

<some-component [data]="someArray">
  <template>foo<template>
</some-component>

它正在使用它来获取模板

@ContentChild(TemplateRef)
public tmpl: TemplateRef<any>;

然后将其像这样在其模板中使用

<div *ngFor="let item of someArrayFromDataInput">
  <template [ngTemplateOutlet]="tmpl"></template>
</div>

现在，我希望能够在原始模板中从item打印一些数据，基本上可以做到这一点

<some-component [data]="someArray">
  <template>foo {{ item }}<template>
</some-component>

有可能吗?

解决方案

已更新以匹配Angular 5+ API ngOutletContext根据 https://stackoverflow.com/a/37654077/301596 重命名为ngTemplateOutletContext

---

这一次着陆 https://github.com/angular/angular/pull/9042 它将像这样

<div *ngFor="let item of someArrayFromDataInput">
  <template 
    [ngTemplateOutletContext]="{
      item: item
    }" 
    [ngTemplateOutlet]="tmpl"></template>
</div>

+

<some-component [data]="someArray">
  <template let-item="item">foo {{ item }}<template>
</some-component>

//登陆

So I have a component with a <template>

<some-component [data]="someArray">
  <template>foo<template>
</some-component>

and it's using this to get hold of the template

@ContentChild(TemplateRef)
public tmpl: TemplateRef<any>;

which is then used in its template like this

<div *ngFor="let item of someArrayFromDataInput">
  <template [ngTemplateOutlet]="tmpl"></template>
</div>

now I would like to be able to print some data from item in the original template, basically to be able to do this

<some-component [data]="someArray">
  <template>foo {{ item }}<template>
</some-component>

is it possible somehow?

解决方案

Updated to match Angular 5+ api ngOutletContext was renamed to ngTemplateOutletContext as per https://stackoverflow.com/a/37654077/301596

---

Once this lands https://github.com/angular/angular/pull/9042 it will work like this

<div *ngFor="let item of someArrayFromDataInput">
  <template 
    [ngTemplateOutletContext]="{
      item: item
    }" 
    [ngTemplateOutlet]="tmpl"></template>
</div>

+

<some-component [data]="someArray">
  <template let-item="item">foo {{ item }}<template>
</some-component>

// edit: landed

这篇关于angular2将数据从[ngTemplateOutlet]返回到< template>.的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！