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

Popular posts from this blog

angular - Ionic slides - dynamically add slides before and after -

minify - Minimizing css files -

Add a dynamic header in angular 2 http provider -