2012-03-12 14 views
0

が初めてknockoutjsをいじるしようとしましたが、動作するように任意の例を得ることができない仕事を得ることができません「姓:」私のブラウザで:ViewModelにとko.appyBindingsでスクリプトタグは、あなたの体の底に呼び出すはknockoutjsが

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html> 
<head runat="server"> 
    <title>Knockout demo</title> 
    <script src="Scripts/knockout-2.0.0.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
     function AppViewModel() { 
      this.firstName = "Helena"; 
      this.lastName = "Christensen"; 
     } 
     ko.applyBindings(new AppViewModel()); 
    </script> 
</head> 
<body> 
    <div> 
     <p>First name: <strong data-bind="text: firstName"></strong></p> 
     <p>Last name: <strong data-bind="text: lastName"></strong></p> 
    </div> 
</body> 
</html> 

答えて

0

次のように動作します:

<html> 
<head runat="server"> 
    <title>Knockout demo</title> 
    <script src="Scripts/knockout-2.0.0.js" type="text/javascript"></script>  
</head> 
<body> 
    <div> 
     <p>First name: <strong data-bind="text: firstName"></strong></p> 
     <p>Last name: <strong data-bind="text: lastName"></strong></p> 
    </div> 
</body> 
</html> 

<script type="text/javascript"> 
    function AppViewModel() { 
     this.firstName = "Helena"; 
     this.lastName = "Christensen"; 
    } 
    ko.applyBindings(new AppViewModel()); 
</script> 
+0

また、JavaScriptを$(function(){....})にラップすることもできます –

0

移動します。

+0

おかげで、それが働きました。ドキュメンテーションでこれを見ていない。 –

0

またはブラウザウィンドウがすべての要素読み込まれた後、あなたがバインディングプロセスをトリガーするwindow.onloadを使用することができます。

<html> 
<head runat="server"> 
    <title>Knockout demo</title> 
    <script src="http://cloud.github.com/downloads/SteveSanderson/knockout/knockout-2.0.0.js" type="text/javascript"></script>  
    <script type="text/javascript"> 
     function AppViewModel() { 
     this.firstName = "Helena"; 
     this.lastName = "Christensen"; 
     } 
     window.onload = function() { 
     ko.applyBindings(new AppViewModel()); 
     }; 
    </script> 
</head> 
<body> 
    <div> 
     <p>First name: <strong data-bind="text: firstName"></strong></p> 
     <p>Last name: <strong data-bind="text: lastName"></strong></p> 
    </div> 
</body> 
</html>