angular - Javascript 到 Angular 2：document.querySelector('el').emit('em') 到 @viewChild

Question

如何转换

HTML

<a-entity id="fading-cube" geometry="primitive: box" material="opacity: 1">
  <a-animation attribute="material.opacity" begin="fade" to="0"></a-animation>
</a-entity>

JS

document.querySelector('#fading-cube').emit('fade');

这是我在 Angular 2 中不起作用的代码。

@ViewChild('fading-cube') fadingCubeInput: any;

fadecube(){    

this.renderer.setProperty(this.fadingCubeInput.nativeElement,'emit',"fade")
}

Answer 1

要使用 访问您的元素@ViewChild()，您可以为其分配一个模板引用变量：

<a-entity #fadingCube ... >

然后您可以在代码中使用该模板变量名称：

@ViewChild('fadingCube') fadingCubeInput: ElementRef;

您应该能够emit('fade')在将 HTMLElement 转换为后调用any：

(this.fadingCubeInput.nativeElement as any).emit('fade');