I am facing an issue with adding "CubeView" from elmarquez/threejs-viewcube to my project. I have created a component and the code for the component is as follows:
import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
import { DOCUMENT } from '@angular/common';
declare let THREE: any;
@Component({
selector: 'app-cube-view-web-gl',
template: '<div id="viewcube"> </div>',
styleUrls: ['./cube-view-web-gl.component.scss']
})
export class CubeViewWebGlComponent implements OnInit {
private domElement: any;
private renderer: any;
private scene : any;
ngOnInit() {
}
constructor() {
this.domElement = document.getElementById('viewcube');
console.log(myElement);
}
}
However, the browser log is only showing null.
I have tried to modify the code in the following ways:
1)
const myElement: HTMLElement | null = document.getElementById('viewcube');
2)
constructor(@Inject(DOCUMENT) private document: Document){
}
But the result remained unchanged.