I am trying to configure a personalized widget for ArcGis Javascript Api 4.5.
My issue is related to the use of 'this' (a MapView) inside of method on() of esri/views/View
I used this.view.on inside a private method of my widget named onViewChange(). I attached all the TypeScript code.
It looks like this:
....
I have access to 'this' inside the private onViewChange method but outside this.view.on.
I can't use 'this' inside of this.view.on because it is undefined.
How can I use and change properties of 'this' (MapView) inside Mapview.on, inside a private method, inside a new widget class that extends Accessor?
I tryed to do the same inside this.view.watch, but I have the same problem.
Cheers!!
Alexys
Solved! Go to Solution.
Since you are already using TypeScript, you want to use fat arrow functions, which will inherit the scope of the block that it's in.
You can read more about it here.
An Introduction to JavaScript ES6 Arrow Functions - Node.js @ IBM
Add the dojo/_base/lang library in your require array and then use lang.hitch(this, _onViewChange); to maintain the scope of this keyword.
Cheers Robert for your very fast answer!
Now, I have this module problem.
Visual Studio Code said "Cannot find module 'dojo/_base/lang'
I configured my widget folder with:
npm init --yes
npm install --save @types/arcgis-js-api
npm install dojo-typings --save-dev
Create tsconfig.json
Inside onViewchange() I wrotte:
Do I need to put it inside the constructor?
Regards!
Sorry I am not a npm node guy so I can’t help with that but it will take care of your scope issue when you get it installed correctly.
Hi Robert,
I just review this [TypeScript - Setting up your development environment for Javascript Api 4.5] and [how to guide on how to develop with Dojo 1 in TypeScript using dojo/typings] and I realized that I just needed to change my tsconfig.json to:
Thank you very much for your help
Hi Robert,
Inside _onViewhange and before this.view.on('pointer-up', ...}); I wrote
I also used the same sentence inside the constructor.
But I don't have access to 'this' inside this.view.on.
__________________________
I fixed it using var that = this;
I wrote
just before
And now I have access to 'this' inside this.view.on, inside _onViewChange
Thank you very much for your help!
Since you are already using TypeScript, you want to use fat arrow functions, which will inherit the scope of the block that it's in.
You can read more about it here.
An Introduction to JavaScript ES6 Arrow Functions - Node.js @ IBM
Hi Rene, According to your advice (An Introduction to JavaScript ES6 Arrow Functions - Node.js @ IBM)
I wrote
just before
And now I have access to 'this' inside this.view.on, inside _onViewChange. It is the solution!
It does not work with var self = this;, because inside 'self' there is another object!
I was trying to use fat arrow, but I don't know how to code it. Could you please tell me how?
Thank you very much!