在TemplateRef上,可以动态添加“let-x”属性吗?

时间:2017-04-14 07:34:31

标签: javascript angular typescript

问题的背景是:我正在尝试执行转换并将上下文变量传递给内部组件。

例如,我的初始DOM的一个代码段:

<line-container>
  <template> <!-- I have as constraint add 'let-item' to access to the variable -->
    <componentA item="item"></component>
    <componentB item="item"></component>
  </template>
</line-container>

这是一个通过'template'标签(@ContentChild)检索其内部内容,然后使用ngFor传递模板和路由的组件。

@Component({
  selector: 'line-container',
  templateUrl: `
           <div *ngFor="let item of items">
             <template [ngTemplateOutlet]="templateRef" 
                       [ngOutletContext]="{item: item}"></template>
           </div>`
})
export class LineContainerComponent implements AfterContentInit {
  public items: any[];
  @ContentChild(TemplateRef) templateRef: TemplateRef<any>;

  constructor(private renderer: Renderer) { }

  ngAfterContentInit() {
    // this.renderer.setElementAttr...
  }
}

如上所述,我很遗憾将'let-item'添加到模板标记中。不幸的是,这是一个我不能做的约束,因此我正在寻找动态添加该属性的方法。

我想用:

this.renderer.setElementAttribute(this.templateRef.elementRef.nativeElement,
                                  'let-item', 'item');

但是我注意到nativeElement的值总是注释:并且它无法找到附加该属性的ElementHTML。知道如何将此模板变量声明到此模板标记中吗?

0 个答案:

没有答案