API key setting in Angular

Question

Hi everyone into Community.

I would like to know how to configure API key in Angular application to be able to load prganization materila produced with ArcGIS Pro, in particular TileLayers.

I have tried with this piece of code

ngOnInit() {    //use esri-loader to load JSAPI modules    return loadModules([      'esri/config',      'esri/Map',      'esri/views/MapView',      'esri/Graphic',      'esri/widgets/BasemapToggle',      'esri/widgets/BasemapGallery'    ])      .then(([ config, Map, MapView, BasemapToggle, BasemapGallery, Graphic]) => {        const esriConfig = new config({           apiKey: "<MY KEY>"        }); but when no map loads.

Any suggestion?

Thanks in advance, best regards.

PaoloF · Answer

Hi,
at this time I changed frontend code using ES modules and now map is loading again.
So I think this issue could be considered solved.

Now I have another probleam that I will describe in different thread.

Really appreciate your help support.

PaoloF · Answer

Hi and thanks for your reply.

I will prepare a test application to show my tries as soon as possible and I will submit it to your attention.

Best regards.

Noah Sager · Answer

Hi @PaoloF, this shouldn't be an issue with Angular, but the issue might have to do with how you are using apiKeys. Can you share a simple reproducible test-app with JavaScript that shows how you are trying to use an apiKey? Also, are the resources hosted in ArcGIS Online?

https://developers.arcgis.com/javascript/latest/release-notes/#api-keys