淘汰jquery程序无法正常工作

时间:2014-05-25 08:54:06

标签: jquery asp.net-mvc-4 knockout.js

我编写了以下MVC应用程序。

索引方法只返回View()。

我正在学习一些视频教程以学习Knockout js,以下是代码。

<script id="tagsTempl" type="text/html">
    <ul>
        {{each tags}}
            <li class="tagItem">
                <span>${Name}</span>
                <div>
                    <a href="#" class="tag-edit">Edit!</a>
                    <a href="#" class="tag-delete">Delete!</a>
                </div>
            </li>
        {{/each}}
    </ul>
</script>

以下是我的JavaScript文件。

$(function () {
    var data = [
        { Id: 1, Name: "Ball Handling" },
        { Id: 2, Name: "Passing" },
        { Id: 3, Name: "Shooting" },
        { Id: 4, Name: "Rebounding" },
        { Id: 5, Name: "Transition" },
        { Id: 6, Name: "Defense" },
        { Id: 7, Name: "Team Offence" },
        { Id: 8, Name: "Team Defence" }
    ];

    var viewModel = {
        tags: ko.observableArray(data),
        tagToAdd: ko.observable(""),

        addTag: function () {
            this.tags.push({ Name: this.tagToAdd() });

        }
    };

    ko.applyBindings(viewModel);
});

我没有获得所需的输出,只是下面的垃圾。 enter image description here

基本上,我无法理解{{each tags}}循环,我无法在互联网上获得适当的资源。任何人都可以建议我正确的解决方案。

1 个答案:

答案 0 :(得分:3)

确保您引用jquery.tmpl.js作为documentation节目。这是working jsfiddle example