Autocomplete von JSON

Question

Ich versuche, ein automatisches Textfeld mit http://easyautocomplete.com anzuzeigen.

Es funktioniert gut mit ihrer Demo.

Ihre json angezeigt wird wie dieses

[ 
    {"name": "Afghanistan", "code": "AF"}, 
    {"name": "Aland Islands", "code": "AX"}, 
    {"name": "Albania", "code": "AL"}, 
    {"name": "Algeria", "code": "DZ"}, 
    {"name": "American Samoa", "code": "AS"}, 
    ... 
] 

Wo, wie mein Code wie

angezeigt

[ 
    { 
    "event": { 
     "id": "28139949", 
     "name": "Comp (FRA) 6th Mar", 
     "countryCode": "FR", 
     "timezone": "CET", 
     "venue": "Compiegne", 
     "openDate": "2017-03-06T12:15:00.000Z" 
    }, 
    "marketCount": 5 
    }, 
    { 
    "event": { 
     "id": "28139948", 
     "name": "Yarm (FC) 6th Mar", 
     "countryCode": "GB", 
     "timezone": "Europe\/London", 
     "venue": "Yarmouth", 
     "openDate": "2017-03-06T18:33:00.000Z" 
    }, 
    "marketCount": 11 
    }, 
    ... 
] 

Der Demo-Code für die, die oben funktioniert, ist wie folgt:

var options = { 
    url: "resources/countries.json", 

    getValue: "name", 

    list: { 
     match: { 
      enabled: true 
     } 
    } 
}; 

Ich weiß, dass das Problem darin liegt, dass mein 'Name'-Feld innerhalb von' Ereignis'-Feldern liegt, aber ich weiß nicht, wie ich targieren soll und das.

Irgendwelche Ratschläge?

Answer 1

Ihre Daten Lauf Objekt durch eine Karte Aufruf:

const data = [ 
 
    { 
 
    "event": { 
 
     "id": "28139949", 
 
     "name": "Comp (FRA) 6th Mar", 
 
     "countryCode": "FR", 
 
     "timezone": "CET", 
 
     "venue": "Compiegne", 
 
     "openDate": "2017-03-06T12:15:00.000Z" 
 
    }, 
 
    "marketCount": 5 
 
    }, 
 
    { 
 
    "event": { 
 
     "id": "28139948", 
 
     "name": "Yarm (FC) 6th Mar", 
 
     "countryCode": "GB", 
 
     "timezone": "Europe\/London", 
 
     "venue": "Yarmouth", 
 
     "openDate": "2017-03-06T18:33:00.000Z" 
 
    }, 
 
    "marketCount": 11 
 
    } 
 
]; 
 

 
const newData = data.map(curr => { 
 
    return { 
 
    name: curr.event.name, 
 
    code: curr.event.countryCode 
 
    }; 
 
}); 
 

 
console.log(newData);