【问题标题】:How to bind the JSON object data to knockout binding with template option?如何使用模板选项将 JSON 对象数据绑定到敲除绑定?
【发布时间】:2017-01-09 06:34:22
【问题描述】:

我正在使用淘汰赛 js。现在我使用模板选项和本地 json 数据作为数据源。在此我无法将数据绑定到模板中的节点。

请在下面获取我的 html 代码:

<div data-bind="template:{name:'treeTemplate',data:{da:Data}}"></div>
    <script id="treeTemplate" type="text/html">
       <b data-bind="text:$data.text"></b>

请在下面获取我的脚本部分

 var treeData = [
            { id: 1, text: "UK"},
            { id: 2, text: "Steven John" },
            { id: 3, text: "USA" },
            { id: 5,  text: "Andrew" },
            { id: 4, text: "Angelica" }
        ];


        window.viewModel = {
            value: ko.observable(new Date(2015, 06, 15)),
            Data:  ko.observableArray(treeData)
        };
        $(function () {
            // declaration
            ko.applyBindings(viewModel);
        });

我也更新了 jsfiddle 中的示例。请获取以下链接:

https://jsfiddle.net/38vnznht/

您能否请任何人就此提出建议。感谢您的帮助。

【问题讨论】:

    标签: javascript knockout.js knockout-2.0 knockout-mapping-plugin knockout-validation


    【解决方案1】:

    您的第一个问题是模板对象中数据的使用。

    data:{da:Data}
    

    要遍历数组,您需要使用 foreach

    foreach:data
    

    因此,您需要更新绑定

    // from this
    <b data-bind="text:$data.text"></b>
    
    // to this
    <b data-bind="text: text"></b>
    

    这是一个工作示例: https://jsfiddle.net/wqe3s1vs/3/

    此外,有关使用带有命名模板的“foreach”的文档: http://knockoutjs.com/documentation/template-binding.html#note-2-using-the-foreach-option-with-a-named-template

    【讨论】:

    • 感谢您的建议,现在我明白了
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2012-06-06
    • 1970-01-01
    • 2011-08-13
    • 1970-01-01
    • 1970-01-01
    • 2020-02-17
    • 1970-01-01
    相关资源
    最近更新 更多