include matching text in suggestions

[andrewharvey]

Currently results will be displayed in whichever language was set in the options.

{ language: 'en', country: 'au' }

{ language: 'zh', country: 'au' }

To get results displayed in one language, but still display the matching text if the query was in another language you need to do something like:

geocoder._typeahead.getItemValue = function (item) {
    if (item.matching_text) { // matching text is the text the query matched, so will be in the same language that the user queried in
        return item.matching_text + ' (' + item.place_name + ')';
    } else {
        return item.place_name;
    }
};

That feels a bit hacky though, I'm thinking if doing this be better supported without overwriting the internal _typeahead.getItemValue method, or even if this should become the default?

[scottsfarley93]

What about adding a constructor option to provide a function that allows implementation-specific customization over how the results are displayed?

Something like:

var geocoder = new MapboxGeocoder({ 
    accessToken: mapboxgl.accessToken,
    render: function(result){
        return item.matching_text + ' (' + item.place_name + ')'
   }
})

We could provide a sensible default (either keep it the same as it is now (use place_name) or use a function that renders the matching text in the dropdown), but provide the ability to override with something different if desired.

[andrewharvey]

👍 I think that's the way to go.

Rethinking about this, the current defaults are probably good as they are.

[scottsfarley93]

The ability to do this was introduced in #208. While the defaults have not changed, once version 4 is released, additional fields can be accessed via the render function.