Select2 Optgroup Result Set - PullRequest
Новая
       9

Select2 Optgroup Result Set

0 голосов
/ 26 октября 2018

Я надеялся получить помощь по следующей проблеме.

Я получаю следующие данные JSON: 

{
    "0": {
    "Name": "Hello World OPTGROUP",
    "values": [
        {
            "Vector": "[REDACTED]",
            "Name": "Hello World",
            "Value": "[REDACTED]",
            "Matched": null
        }
    ]
},    
{
    "1": {
    "Name": "Lorem Ipsum OPTGROUP",
    "values": [
        {
            "Vector": "[REDACTED]",
            "Name": "Lorem Ipsum",
            "Value": "[REDACTED]",
            "Matched": null
        }
    ]
}

Как мне создать выпадающий набор результатов processResults , который включает метки для каждого массива? 

<select>
    <optgroup label="Hello World OPTGROUP">
    <option>Values[0] Value</option>
    <option>Values[1] Value</option>
    <optgroup label="Lorem Ipsum OPTGROUP">
    <option>Values[0] Value</option>
    <option>Values[1] Value</option>
</select>

1 Ответ

0 голосов
/ 26 октября 2018

Ваши данные JSON были не совсем ... полными, поэтому я добавил {}, где я думал, что они вам нужны.

Один из способов сделать это будет: 

const data = [{
    "0": {
    "Name": "Hello World OPTGROUP",
      "values": [
          {
              "Vector": "[REDACTED]",
              "Name": "Hello World",
              "Value": "[REDACTED]",
              "Matched": null
          }
      ]
    }
},    
{
    "1": {
      "Name": "Lorem Ipsum OPTGROUP",
      "values": [
          {
              "Vector": "[REDACTED]",
              "Name": "Lorem Ipsum",
              "Value": "[REDACTED]",
              "Matched": null
          },
          {
              "Vector": "[REDACTED]",
              "Name": "Lorem Ipsum",
              "Value": "[REDACTED]2",
              "Matched": null
          }
       ]
    }
}];
const optMap = e => `<option>${e.Value}</option>`
let templateInner = data
  .map(e=>e[Object.keys(e)])
  .map(e=>`
    <optgroup label="${e.Name}">
    ${e.values.map(optMap).join('')}`)
  .join('')
let template = `<select>${templateInner}
</select>`
console.log(template)
...