How to find valid Angular exported members?

JJones — Sun, 20 May 2018 16:19:33 GMT

I'm trying to add a Search widget to the base Esri Angular example. Essentially trying to combine:

GitHub - Esri/angular-cli-esri-map: Example Angular component for building mapping applications with the ArcGIS API for …

with

ArcGIS API for JavaScript Sandbox

to add a search widget in the Angular example. Within esri-map.components.ts I have this (my additions in bold below). Compile error is: Namespace '__esri' has no exported member 'SearchWidgetProperties'. I realize this may be an Angular question but how can I see a list of valid exported entities? And how would I hook up the search widget to the map in this context? Thanks for any help getting me pointed in the right direction.

esri-map-components.ts:

.....

public ngOnInit() {

loadModules([

'esri/Map',

'esri/views/MapView',

'esri/widgets/Search',

])

.then(([EsriMap, EsriMapView, EsriSearch]) => {

// Set type for Map constructor properties

const mapProperties: esri.MapProperties = {

basemap: this._basemap

};

let map: esri.Map = new EsriMap(mapProperties);

// Set type for MapView constructor properties

const mapViewProperties: esri.MapViewProperties = {

container: this.mapViewEl.nativeElement,

center: this._center,

zoom: this._zoom,

map: map

};

let mapView: esri.MapView = new EsriMapView(mapViewProperties);

let searchWidget: esri.Search = new EsriSearch();

const searchWidgetProperties: esri.SearchWidgetProperties = {

view : mapView

};

mapView.ui.add(searchWidget, {

position: 'top-right'

});

mapView.when(() => {

// All the resources in the MapView and the map have loaded. Now execute additional processes

this.mapLoaded.emit(true);

}, err => {

console.error(err);

});

})

.catch(err => {

console.error(err);

});

} // ngOnInit

Re: How to find valid Angular exported members?

AndyGup — Mon, 21 May 2018 19:43:10 GMT

Hi James,

>> I realize this may be an Angular question but how can I see a list of valid exported entities?

Looks like you have a typescript question, but in general for questions about 3rd party framework integration it's best to post questions directly on the respective github repos.

You can use an IDE like VS Code and it will show the exported members via intellisense. Here's a link for more info.

If you have doubts and want to double check the definitive source you can go directly to our `d.ts` file and control-F for the name: https://raw.githubusercontent.com/Esri/jsapi-resources/master/4.x/typescript/arcgis-js-api.d.ts

>> And how would I hook up the search widget to the map in this context?

There are several options. Option A - remove the reference to "esri.SearchWidgetProperties" because there isn't one. Option B - replace it with type "any", or Option C - you could create your own interface to enforce which properties are valid.

topic How to find valid Angular exported members? in ArcGIS JavaScript Maps SDK Questions

How to find valid Angular exported members?

Re: How to find valid Angular exported members?