Question

我之前在MVC中获得了淘汰赛，但不幸的是我丢失了代码，需要帮助搞清楚。

我想简单地在我的MVC项目的〜/ wwwsource /文件夹中放置一个html页面，在那个页面中我想演示一个简单的淘汰示例。

（最终，我实际上想在MVC视图中使用淘汰赛，在Razor 的情况下使用淘汰赛，如果可能的话，但首先我至少想要一个简单的工作示例，并从那里延伸

我尝试了以下内容，它在JSFiddle中有效，但在Visual Studio中无效：

        <script src="lib/knockout/dist/knockout.debug.js" type="text/javascript">

    // Here's my data model
    var ViewModel = function (first, last) {
        this.firstName = ko.observable(first);
        this.lastName = ko.observable(last);

        this.fullName = ko.pureComputed(function () {
            // Knockout tracks dependencies automatically. It knows that fullName depends on firstName and lastName, because these get called when evaluating fullName.
            return this.firstName() + " " + this.lastName();
        }, this);
    };

    ko.applyBindings(new ViewModel("Planet", "Earth")); 
</script>



<p>First name: <input data-bind="value: firstName" /></p>
<p>Last name: <input data-bind="value: lastName" /></p>
<h2>Hello, <span data-bind="text: fullName"> </span>!</h2>

Answer 1

在html完全呈现之前，您正在调用javascript。因此，当ko.applyBindingsis将html称为仅部分加载时。

最简单的解决方案是使用jQuery将javascript包装在文档加载的回调中（因为你使用的是敲门声，它应该存在）。

您还有一些无效的脚本标记语法。在为页面开始新标记之前，需要关闭knockout脚本标记。

<script src="lib/knockout/dist/knockout.debug.js" type="text/javascript">
</script>

<script type="text/javascript">
// Here's my data model
var ViewModel = function (first, last) {
    this.firstName = ko.observable(first);
    this.lastName = ko.observable(last);

    this.fullName = ko.pureComputed(function () {
        // Knockout tracks dependencies automatically. It knows that fullName depends on firstName and lastName, because these get called when evaluating fullName.
       return this.firstName() + " " + this.lastName();
    }, this);
};

$(document).ready(function(){
    ko.applyBindings(new ViewModel("Planet", "Earth")); 
})
</script>

<p>First name: <input data-bind="value: firstName" /></p>
<p>Last name: <input data-bind="value: lastName" /></p>
<h2>Hello, <span data-bind="text: fullName"> </span>!</h2>

在mvc淘汰 - 简单的例子不工作

1 个答案: