データバインディングは単純なKnockoutjsアプリケーションでは機能しません

私はKOを勉強しようとしていますが、これをHTMLで書いてみると、入力テキストボックスには読み込み時の値がありません。誰かが助けることができますか？データバインディングは単純なKnockoutjsアプリケーションでは機能しません

<html> 
<head> 
<script src="C:\Data\Visual Studio 2013\Projects\WebApplication3\KObasics\Scripts\knockout-3.4.2.debug.js" type="text/javascript"> 
</script> 
<script type="text/javascript"> 

// This is a simple *viewmodel* - JavaScript that defines the data and behavior of your UI 
function AppViewModel() { 
    this.firstName = "Bert"; 
    this.lastName = "Bertington"; 
} 

// Activates knockout.js 
ko.applyBindings(new AppViewModel()); 

</script> 
</head> 
<body> 
<p>Use this area to provide additional information.</p> 
<input data-bind="value:firstName"/> 
<p data-bind="text:firstName"></p> 
</body> 
</html>

出典

2017-08-01 Muthukumar Palaniappan

メインHTML本体の後にJavaScriptファイルを移動しようとしましたか？ – muhihsan

@ M.Ihsanごめんなさい申し訳ありません –

私は以下の回答を投稿しました – muhihsan

あなたのHTMLとJavaScriptは、下で問題なく動作します。

// This is a simple *viewmodel* - JavaScript that defines the data and behavior of your UI 
 
function AppViewModel() { 
 
    this.firstName = "Bert"; 
 
    this.lastName = "Bertington"; 
 
} 
 

 
// Activates knockout.js 
 
ko.applyBindings(new AppViewModel());

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script> 
 

 
<p>Use this area to provide additional information.</p> 
 
<input data-bind="value:firstName"/> 
 
<p data-bind="text:firstName"></p>

あなただけの終了タグ（</body>）前<body>要素の最後に<script>タグを移動する必要があります。 DOM要素がノックアウトモデルにバインドされる前にレンダリングされるようにする。それは次のようになります：

<html> 
<head> 
<script src="C:\Data\Visual Studio 2013\Projects\WebApplication3\KObasics\Scripts\knockout-3.4.2.debug.js" type="text/javascript"> 
</script> 
</head> 
<body> 
<p>Use this area to provide additional information.</p> 
<input data-bind="value:firstName"/> 
<p data-bind="text:firstName"></p> 
</body> 

<script type="text/javascript"> 

// This is a simple *viewmodel* - JavaScript that defines the data and behavior of your UI 
function AppViewModel() { 
    this.firstName = "Bert"; 
    this.lastName = "Bertington"; 
} 

// Activates knockout.js 
ko.applyBindings(new AppViewModel()); 

</script> 
</html>

出典

2017-08-01 01:33:27 muhihsan

ありがとうございます。私は理解し、それをバインドするためにjqueryドキュメント準備関数を使用します。 –

それも仕事をする:) – muhihsan

データバインディングは単純なKnockoutjsアプリケーションでは機能しません

答えて

関連する問題