2

数か月前にノックアウトの仕事を始めましたが、今のところとても順調です。今日、HTML でいくつかの入力を処理していたときに、非常に退屈な問題に遭遇し、理解するのに時間がかかりました。これが私のコードです:

<div class="add-box" style="display:none;" id="new-user">
   <textarea placeholder="Name" data-bind="value : name"></textarea>
</div>

<script>
    function UserViewModel() {
        var self = this;
        self.name= ko.observable('');
    }


    $(document).ready(function () {
        ko.applyBindings(new  UserViewModel(), document.getElementById('new-user'));
    })
</script>

このコードは正常に動作しますが、最初に行ったのは次のようなものでした:

<textarea placeholder="Name" data-bind="value : name()"></textarea>

それらの唯一の違いは、name プロパティの末尾にある括弧 () です。これは観察可能なものなので、双方向バインディングを行うには括弧が必要だと思いました。しかし、それらを使用すると、テキストエリアの値を変更するたびに、すべてを削除してもビューモデルがそれに応じて更新されません。

この場合、括弧を削除する必要がある理由と、data-bind="text: I have to put them??

4

2 に答える 2

4

これが KO の魔法です:特別な "Observable" function-objects .

括弧を使用すると、オブザーバブル (これは単なる特別な関数です) を評価し、その結果、 「ライブ」データ バインディングを破る値になります。この場合、基になる(文字列など) はバインドされますが、オブザーバブルはバインドされません。そこから値が得られました。

基礎となるバインディングは、(通常) 観察可能な値と観察不可能な値の両方を処理するのに十分なほどスマートです。ただし、バインディングはオブザーバブルのみを更新でき、オブザーバブルを介してのみモデルの変更を検出できます。

したがって、通常、宣言型データ バインディングでObservableを使用する場合は、括弧を含めません。

オブザーバブルを渡すと、Magic Just Works が確実に機能し、View と Model の同期が維持されます。上記のバインドされたオブザーバブルへの変更は、バインディング自体がオブザーバブル/モデルを更新する必要がない場合でも、適切なバインディングの更新をトリガーします (たとえば、HTML を更新できるようにするため)。


ただし、まれに、その時点で適切な値が必要なだけで、バインディングがモデルとの間で更新されることを望まない場合があります。これらのまれなケースでは、値の抽出を強制し、オブザーバブル自体をバインドしないために、括弧を使用することは正しいです。

于 2013-10-04T01:01:37.340 に答える