I'm getting an error when assigning a source to a searchWidget. It appears I might be using incorrect syntax for TypeScript.
(TS) Type '{ locator: Locator; name: string; placeholder: string; }[]' is not assignable to type 'Collection<FeatureLayerSource | LocatorSource>'. Property 'add' is missing in type '{ locator: Locator; name: string; placeholder: string; }[]'.
import Locator = require("esri/tasks/Locator");
import Search = require("esri/widgets/Search");
var sources = [{
locator: new Locator({ url: "https://gis.spokanecounty.org/arcgis/rest/services/Locators/AddrComposite/GeocodeServer" }),
name: "addrComposite",
placeholder: "Search Addresses"
}];
var searchWidget = new Search({
view: view,
includeDefaultSources: false
});
searchWidget.sources = sources;
Similar issue here: typescript files error on search widget
Definition file used: Small updates for version 4.8 (#27426) · DefinitelyTyped/DefinitelyTyped@0575e7d · GitHub
Solved! Go to Solution.
Hey Phil, can you try this as a workaround for now?
const searchWidget = new Search({
view: view,
includeDefaultSources: false
});
const sources = [
{
locator: new Locator({
url:
"https://gis.spokanecounty.org/arcgis/rest/services/Locators/AddrComposite/GeocodeServer"
}),
name: "addrComposite",
placeholder: "Search Addresses"
}
];
type SearchSource = __esri.LocatorSource | __esri.FeatureLayerSource;
searchWidget.sources.addMany(sources as SearchSource[]);
Hey Phil,
I believe it is because it is expecting a collection of a certain type and can't autocast the collection properly. Can you try just pushing to the existing sources since it should be empty on initialize?
import Locator = require("esri/tasks/Locator");
import Search = require("esri/widgets/Search");
var searchWidget = new Search({
view: view,
includeDefaultSources: false
});
searchWidget.sources.addMany([{
locator: new Locator({ url: "https://gis.spokanecounty.org/arcgis/rest/services/Locators/AddrComposite/GeocodeServer" }),
name: "addrComposite",
placeholder: "Search Addresses"
}]);
I'll talk to some colleagues and see if we can fix this.
-Matt
Hi Matt Driscoll
Thanks for taking the time to respond. Looks like the collection is still not cast properly. I have attached the full error to my main post.
TS2345 (TS) Argument of type '{ locator: Locator; name: string; placeholder: string; }[]' is not assignable to parameter of type 'Collection<FeatureLayerSource | LocatorSource> | (FeatureLayerSource | LocatorSource)[]'.
...
Hey Phil, can you try this as a workaround for now?
const searchWidget = new Search({
view: view,
includeDefaultSources: false
});
const sources = [
{
locator: new Locator({
url:
"https://gis.spokanecounty.org/arcgis/rest/services/Locators/AddrComposite/GeocodeServer"
}),
name: "addrComposite",
placeholder: "Search Addresses"
}
];
type SearchSource = __esri.LocatorSource | __esri.FeatureLayerSource;
searchWidget.sources.addMany(sources as SearchSource[]);
That works.
I can't get results with a 10.3.1 server, but can with ESRI's World Geocoder (10.6.1). This is a different issue, though. (https://community.esri.com/thread/220696-search-widget-sends-incorrect-query-string-48-js-api )
Thanks for your help.
This now works as advertised at 4.9.
import Search = require("esri/widgets/Search");
import Locator = require("esri/tasks/Locator");
var sources = [{
locator: new Locator({ url: "https://<url>/AddrComposite/GeocodeServer" }),
name: "AddrComposite",
placeholder: "search addresses",
singleLineFieldName: "SingleLine",
}];
var searchWidget = new Search({
view: view,
includeDefaultSources: false,
suggestionsEnabled: true,
sources:sources
});
var searchExpand = new Expand({
view: view,
content: searchWidget
})
view.ui.add([
{
component: searchExpand,
position: "top-left",
index: 1
}
]);