alexurquhart/vue-bootstrap-typeahead

Suggestion: support array of objects as data source

mnantel opened this issue · 4 comments

Greetings,

Project works great! I am not very experience with JS, but what I was trying to do with this code was to use it to select an item within an array of objects, whereas the searched properties might be distinct than property bound to vmodel. As it stands, is my assumption correct that this is only for simple arrays of strings?

you should be able to use the serializer

 :data="associative_array"
 :serializer="myvar=> myvar.keywithstringfromassociative_array"

If we understand you right, this should already be supported.

@alexurquhart,

I have an object array and I want to search it with different properties at the same time. I guess, there is not any way to do that now, isn't it? When I use a serializer, it searches only in the serialized array.

@alexurquhart,

I have an object array and I want to search it with different properties at the same time. I guess, there is not any way to do that now, isn't it? When I use a serializer, it searches only in the serialized array.

you could maybe modify your data strings from your API response (or after the response before you set the value to your v-model"
example :
your response is

{[
{
    'username':'my_username', 
    'first_name':'my_first_name'
},
    'username':'your_username', 
    'first_name':'your_first_name'
}
]} 

use javascript to convert the strings to something like this. (note | is just a character used to separate data in your string) you can use anything you want.

{[
{'my_username | my_first_name'},
{'your_username' | your_first_name}
]} 

then use the custom separator character | to modify the display using a computed property on the "query" v-model data. therefore it only shows my_username but still queries the other data.