three.js and Angular - function is not defined -
i have developed simple application renders cube angular 4 , three.js
. have angular component called viewercomponent
, cube rendered. code of component relevant question following (the code of init
method not included here simplicity):
import { component, afterviewinit } '@angular/core'; import * 3 'three'; @component({ moduleid: module.id, templateurl: 'viewer.component.html', styleurls: ['viewer.component.css'], }) export class viewercomponent implements afterviewinit{ constructor() { } ngafterviewinit(){ this.init(); } init(){ // define camera, scene, cube, renderer, etc } callback_method(){ console.log("resize!"); } onwindowresize(){ this.callback_method(); } }
i message shown in browser console when size of window of browser changed. trying implement functionality, found following error.
when run application, , change size of window of browser, following error raised: error typeerror: this.callback_method not function
. however, if change code of method onwindowresize
following, expected behaviour:
onwindowresize(){ console.log("resize!"); }
i new frontend technologies , three.js
, , lost. have ideas on why hapenning? in advance.
you can use hostlistener dom events
import { component, afterviewinit, hostlistener } '@angular/core'; export class viewercomponent implements afterviewinit{ @hostlistener('window:resize', ['$event']) onresize(event: event) { this.callback_method(); } constructor() { } callback_method(){ console.log("resize!"); } }
Comments
Post a Comment