3

だからここで私がやろうとしていること

ノックアウトを使用して、変数 myvalue にコンテンツがある場合にのみ表示されるものが必要です

ここに私のコードがあります

html

<script type='text/javascript' src="../js/knockout-2.3.0.js" defer="defer"></script>
<script type="text/javascript" src="../js/searchModel.js" defer="defer" ></script>

<h2>Welcome to My World :D</h2>

<div data-bind="visible: myValues().length > 0">
    You will see this message only when 'myValues' has at least one member.
</div>

JS

function helloModel() {
// Editable data
this.viewModel = {
    myValues: ko.observableArray([]) // Initially empty, so message hidden
   };
  //viewModel.myValues.push("some value"); // Now visible
}

私がいつも得るエラーは次のとおりです。

Uncaught ReferenceError: Unable to parse bindings.
Bindings value: visible: myValues().length > 0
Message: myValues is not defined

ほとんどの場合、スクリプト タグに追加した defer 属性が原因です。これは、html 要素全体をレンダリングするまでファイルが読み込まれないことを意味します。

ただし、これは重要であり、次の 3 つのシナリオで説明します。

1-次のように、検索モデルではなくknokoutを延期します

そのため、HTML 要素をレンダリングする前に検索モデルが含まれるようになりました。ただし、これは knokout のコードを使用するため、問題が発生します。

Uncaught ReferenceError: ko is not defined

2-ノックアウトではない検索モデルの延期

<script type='text/javascript' src="../js/knockout-2.3.0.js" defer="defer"></script>
<script type="text/javascript" src="../js/searchModel.js" ></script>

同じ古い問題が発生します

Uncaught ReferenceError: Unable to parse bindings.
Bindings value: visible: myValues().length > 0
Message: myValues is not defined

3-延期を忘れてください

<script type='text/javascript' src="../js/knockout-2.3.0.js" ></script>
<script type="text/javascript" src="../js/searchModel.js" ></script>

次の問題も発生します Uncaught TypeError: Cannot read property 'nodeType' of null

スクリプトが html に読み込まれ、作成される前に要素をバインドしようとするためです。

それで、その問題を解決するために何をお勧めしますか:)

4

2 に答える 2

3

これは、投稿されたコードで機能するはずです。

<h2>Welcome to My World :D</h2>

<div data-bind="visible: myValues().length > 0">
    You will see this message only when 'myValues' has at least one member.
</div>

<script type='text/javascript'>
  ko.applyBindings((new helloModel()).viewModel)
</script>

ビューモデルを次のようにリファクタリングすることをお勧めします

function helloModel() {
    var self = this;
    self.myValues = ko.observableArray([]);
    self.pushHello = function(data,e) {
       self.myValues.push("Hello, world!");
    };
    //self.myValues.push("some value"); // Now visible
}

そして、初期化コードで

<script type='text/javascript'>
  ko.applyBindings(new helloModel())
</script>
于 2013-08-02T18:41:51.437 に答える