将多维 JSON 对象数组加载到 selectize.js

Question

我想将此 JSON 加载到 selectize 中：

{"platforms":

[{"id":32,"name":"Sega Saturn","slug":"saturn"},

{"id":14,"name":"Mac","slug":"mac"},

{"id":47,"name":"Virtual Console (Nintendo)","slug":"vc"},

{"id":34,"name":"Android","slug":"android"},

{"id":84,"name":"SG-1000","slug":"sg1000"},

{"id":58,"name":"Super Famicom","slug":"sfam"},

{"id":82,"name":"Web browser","slug":"browser"}]

}

我希望它的操作与this example provided by the Selectize.js developers 非常相似（不包括每个中的 URL 部分），除了显然不是使用我的 json 数据的预制 ID 和名称。

感谢任何帮助。

我目前正在尝试使用的代码：

options: [
    for (var i = 0; i < platforms.platforms.length; i++) 
    {
        var counter = platforms.platforms[i];
        {id: counter.id, title: counter.name},
        console.log(counter.name);
    }

以下是 JSON 在控制台中记录时的样子：

编辑： This is another example that I'm looking at as it uses JSON.

Answer 1

当你声明一个变量时，你不能在数组/对象中使用for。 Javascript 不是 PHP&HTML 那样的模板。

您还错过了.slug。试试这个：

var data = JSON.parse('{"platforms":[{"id":32,"name":"Sega Saturn","slug":"saturn"},{"id":14,"name":"Mac","slug":"mac"},{"id":47,"name":"Virtual Console (Nintendo)","slug":"vc"},{"id":34,"name":"Android","slug":"android"},{"id":84,"name":"SG-1000","slug":"sg1000"},{"id":58,"name":"Super Famicom","slug":"sfam"},{"id":82,"name":"Web browser","slug":"browser"}]}');
var options = [];
$.each(data.platforms, function()
{
    options.push({
        id: this.id,
        title: this.name,
        url: "hhtp://site.com/"+this.slug
    });
});
var $select = $('#select-tools').selectize({
    maxItems: null,
    valueField: 'id',
    labelField: 'title',
    searchField: 'title',
    options: options,
    create: false
});

Answer 2

您显示的代码有几个语法错误。你对 JavaScript 不是很熟悉吧？

@klenium 是对的，无论是在他的建议中，还是通过展示可以独立运行的完整代码。你应该去一个像 Plunkr 或 JSFiddle 这样的网站，添加正确的导入，在那里运行这段代码，如果它没有达到你的预期，把页面的链接放在这里，这样我们就可以检查出了什么问题。

注意：Selectize 的一个好处是它可以在不进行预处理的情况下获取几乎任何数据，因此代码可能（未经测试！）可以简化为：

var $select = $('#select-tools').selectize({
    maxItems: null,
    valueField: 'id',
    labelField: 'title',
    searchField: 'title',
    options: data.platforms, // Just use the Json data as it is
    create: false
});