在淘汰赛中绑定 Json答案

【问题标题】：Bind Json in Knockout在淘汰赛中绑定 Json
【发布时间】：2023-04-03 12:40:02
【问题描述】：

我必须绑定json类型的“城市”字段：

{
"italia": [
    {
        "regione": "Abruzzo",
        "capoluoghi": [
            {
                "citta": "Chieti",
                "sigla": "CH"
            },
            {
                "citta": "L'Aquila",
                "sigla": "AQ"
            },
            {
                "citta": "Pescara",
                "sigla": "PE"
            },
            {
                "citta": "Teramo",
                "sigla": "TE"
            }
        ]
    },{
        "regione": "Basilicata",
        "capoluoghi": [
            {
                "citta": "Matera",
                "sigla": "MT"
            },
            {
                "citta": "Potenza",
                "sigla": "PZ"
            }
        ]
    }, ...

在“选择”html 中，通过淘汰赛。我输入了代码：

self.provincia = ko.mapping.fromJS([]);
$.getJSON("italia.json", function (data) {
        ko.mapping.fromJS(data.italia, {}, self.provincia)
    })

在 html 中：

    <div  data-bind="with: provincia">
<select class="mm-menu__link" id="Provincia" data-bind:"foreach: capoluoghi">
                    <option data-bind="text:citta"></option>
                </select>
                    </div>

为了显示所有城市，可惜我一无所获！

我做错了什么？

戴夫

【问题讨论】：

您能否在 MCVE 中重新创建整个代码，因为（例如）不清楚您是否甚至调用 ko.applyBindings 等。
有点像戴夫jsfiddle.net/LkqTU/27300。欢呼
建议：将代码中的变量翻译成英文。它看起来更符合语言关键字，并且更容易在网络上寻求帮助。

标签： javascript json knockout.js

【解决方案1】：

你的问题有点不清楚，我希望这是你最后看到的。

查看：

<div data-bind="foreach: provincia">
    <select class="mm-menu__link" id="Provincia" data-bind="foreach: capoluoghi">
        <option data-bind="text:citta"></option>
    </select>
</div>

视图模型：

var ViewModel = function () {
    var self = this;
    self.provincia = ko.observable();
    ko.mapping.fromJS(json.italia, {}, self.provincia)
};
ko.applyBindings(new ViewModel());

工作示例here

如果您想在一个下拉菜单中显示所有城市，请选中 here

【讨论】：

好的，但我不想为每个“区域”选择这么多，但我想选择一个在“citta”中包含所有插入值的......
@Dave 你在看级联功能吗？比如根据地区选择显示城市或在一个下拉菜单中显示所有 citta？