来自 JSON 文件的敲除绑定答案

【问题标题】：Knockout bindings from JSON file来自 JSON 文件的敲除绑定
【发布时间】：2016-11-29 11:23:13
【问题描述】：

我的绑定有什么问题？我只是得到[object HTMLElement] 为每个返回。

请注意，这是一个精简版本，我希望访问所有 JSON 值。

小提琴：

代码：

<div data-bind="text: intro"></div>

function ViewModel(stories) {
    var self = this;
    self.stories = ko.observableArray(ko.utils.arrayMap(stories, function(story) {
        return story.stories;
    }));
};

$.getJSON('data.json', function(data) {
    window.storyViewModel = new ViewModel(data.stories);
    ko.applyBindings(window.storyViewModel);
});

JSON（文件名`data.json`）：

{
    "stories": [
        {
            "intro": "Hi",
            "outro": "Bye",
            "elements": [
                {
                    "title": "Title 1",
                    "image": "img/image1.jpg",
                    "paragraph": "Wordswordswords"
                },
                {
                    "title": "Title 2",
                    "image": "img/image2.jpg",
                    "paragraph": "More wordswordswords"
                }
            ]
        }
    ]
}

【问题讨论】：

您发布的代码有点太了。它不会重现您在问题中提到的行为（jsfiddle 也不会）。如果我尝试修复代码中的错误/缺失位，请提供 work just fine。请更新问题以包含完整但 minimal reproducible example。
我已经更新了你的 jsfiddle 以使它变得更好 (jsfiddle.net/0416f0s7/4)。您的数据项包含在两个数组中，因此您无法绑定到“intro”属性 - 包含在 2 个 foreach 绑定中，或通过“点”获取属性。

标签： javascript html json knockout.js data-binding

【解决方案1】：

您的 html 更改为

`<div data-bind="foreach:stories">
        <div data-bind="text: intro"></div>
    </div>

您的代码更改为

  function test(stories) {
        var self = this;
        self.stories = ko.observableArray(ko.utils.arrayMap(stories, function (story) {
            return story;
        }));

    }

【讨论】：

小提琴：

代码：

JSON（文件名data.json）：

JSON（文件名`data.json`）：