ko.observable屬性中的默認值不顯示

我現在正在嘗試knockoutjs，我相當基本的JavaScript知識。我爲此設置了一個基本的ASP.NET MVC 3應用程序。以下是我設置的主頁/ Index.cshtml觀點摘錄：ko.observable屬性中的默認值不顯示

@if(false) 
{ 
    <script src="../../Scripts/jquery-1.6.3.js" type="text/javascript"></script> 
    <script src="../../Scripts/knockout-1.3.0beta.debug.js" type="text/javascript"></script> 
} 

@{ 
    ViewBag.Title = "Home Page"; 
} 

<script type="text/javascript"> 
    var entryDataViewModel = { 
     registration: ko.observable("Registration"), 
     registeredName: ko.observable("Name"), 
     entryClass: ko.observable("Junior") 
    }; 

    ko.applyBindings(entryDataViewModel); 
</script> 

<h2>@ViewBag.Message</h2> 
<p> 
    Registration: <span data-bind="text: registration"></span><br /> 
    Name: <span data-bind="text: registeredName"></span><br /> 
    Class: <span data-bind="text: entryClass"></span><br /> 

    To learn more about ASP.NET MVC visit <a href="http://asp.net/mvc" title="ASP.NET MVC Website">http://asp.net/mvc</a>. 
</p>

對於一些奇怪的原因，沒有什麼是展示，甚至沒有默認值。如果我通過Firebug進行調試，ViewModel顯示的屬性也是空的。我在這裏錯過了什麼嗎？

非常感謝， Dany。

補充：_Layout.cshtml的內容 - 這是所有股票的標準的東西，除了增加淘汰賽，並使用jQuery 1.6.3

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8" /> 
    <title>@ViewBag.Title</title> 
    <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" /> 
    <script src="@Url.Content("~/Scripts/knockout-1.3.0beta.js")" type="text/javascript"></script> 
    <script src="@Url.Content("~/Scripts/jquery-1.6.3.min.js")" type="text/javascript"></script> 
    <script src="@Url.Content("~/Scripts/modernizr-1.7.min.js")" type="text/javascript"></script> 
</head> 
<body> 
    <div class="page"> 
     <header> 
      <div id="title"> 
       <h1>My MVC Application</h1> 
      </div> 
      <div id="logindisplay"> 
       @Html.Partial("_LogOnPartial") 
      </div> 
      <nav> 
       <ul id="menu"> 
        <li>@Html.ActionLink("Home", "Index", "Home")</li> 
        <li>@Html.ActionLink("About", "About", "Home")</li> 
       </ul> 
      </nav> 
     </header> 
     <section id="main"> 
      @RenderBody() 
     </section> 
     <footer> 
     </footer> 
    </div> 
</body> 
</html>

來源

2011-09-17 codedog

http://jsfiddle.net/ S8Rh5/ –

上面投票的答案只有當我在一個普通的網頁上試過時纔有效 - 而不是當我在我的MVC視圖中嘗試它時。事實證明，我把腳本塊放在錯誤的位置上。在處理完頁面元素之後，我將它移動到視圖的末尾。另一個選擇是將其包裝在$（document）.ready（）中，然後您可以將包含ViewModel的腳本塊並調用ko.applyBindings（）到您想要的任何位置...

來源

2011-09-18 00:12:35 codedog

是的，沒錯，你應該使用'$（document）'，我錯誤地寫了'window' .. –

它應該是$（document）.ready（）而不是$（document）.load（），對嗎？ – codedog

是的。 http://api.jquery.com/ready/ –

使用$(document).load(function(){：

<script type='text/javascript'> 
    //<![CDATA[ 
    $(document).load(function(){ 
    var entryDataViewModel = { 
     registration: ko.observable("Registration"), 
     registeredName: ko.observable("Name"), 
     entryClass: ko.observable("Junior") 
    }; 

    ko.applyBindings(entryDataViewModel); 
    }); 
    //]]> 
    </script>

看看：http://jsfiddle.net/S8Rh5/ - 它工作得很好。

來源

2011-09-17 22:15:25

這似乎是在MVC視圖中給予js intellisense的Visual Studio常見做法。該部分根本不呈現給瀏覽器。 – codedog

但你確實需要它被渲染.. –

是的，它通過主佈局呈現，其中包含對knockout，jquery和modernizr的全部引用 - 全部位於頁面的部分 – codedog

ko.observable屬性中的默認值不顯示

回答

相關問題