角度templateRef nativeElement是空注释，而不是原始元素 [英] angular templateRef nativeElement is an empty comment instead of original element

问题描述

我正在开发一个角度指令，该指令将dropdownlist转换为radioListbox. 这是我的初始代码:

I am developing an angular directive that converts dropdownlist to radioListbox. here is my initial code :

import { Directive, Input, TemplateRef, ViewContainerRef,OnInit } from '@angular/core';

@Directive({
  selector: '[radioList]'
})
export class RadioListDirective implements OnInit  {



  constructor(private templateRef: TemplateRef<any>, private vcRef: ViewContainerRef) {

  }

  ngOnInit() {

    console.log(this.templateRef);
    this.vcRef.createEmbeddedView(this.templateRef);

  }
}

和

<div>
  test
</div>


<select *radioList><option>1</option><option>2</option></select>

它应该记录TemplateRef，其ElementRef的nativeElement是select.但是结果是空注释，它的下一个元素是select.

It should log the TemplateRef whose ElementRef 's nativeElement is a select. But the result is and empty comment that its next element is the select .

推荐答案

目前正在使用的棘手解决方案:

Hacky solutions currently working:

this.templateRef.elementRef.nativeElement.nextSibling

使用viewContainerRef.get

(this.viewContainerRef.get(0) as any).rootNodes[0]

(请注意，在示例代码中，您使用的是vcRef而不是我在这里使用的viewContainerRef.)

(Note, from your example code you used vcRef instead of viewContainerRef as I used here.)

这篇关于角度templateRef nativeElement是空注释，而不是原始元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！