4

私はまだノックアウトにかなり慣れていないので、ノックアウトを使用してブートストラップタブを表示および非表示にしようとしています。

基本的に私は計算されたオブザーバブルを持っています：

self.isActive = ko.computed(function () {
            var selected = ko.utils.arrayFirst(self.padParticipant(), function (item) {
                return item.ParticipationStatus == 'Active';
            });
            return selected !== null ? true : false;
        });

これらのタブを更新するには：

<ul class="nav nav-tabs" id="padTabs">
        <li data-bind="fadeVisible: !isActive()"><a href="#joinPad">Join PAD</a></li>
       <li class="active"><a href="#history">History</a></li>
       <li data-bind="fadeVisible: isActive()"><a href="#update">Update Subscription</a></li>
</ul>

ページを更新すると正しいタブが非表示になるという意味で、計算は正しく機能していますが、更新せずに機能する必要があります。

4

1 に答える 1

9

この問題は、監視可能な配列のルールに加えて、計算された監視可能なものを使用する場合に、Knockoutフレームワークで何が起こっているかを理解することに関係しています。まず、監視可能な配列に関するメモを見てみましょう。

キーポイント：observableArrayは 、それらのオブジェクトの状態ではなく、どのオブジェクトが配列内にあるかを追跡します

オブジェクトをobservableArrayに配置するだけでは、そのオブジェクトのすべてのプロパティ自体を監視可能にするわけではありません。もちろん、必要に応じてこれらのプロパティを監視可能にすることもできますが、それは独立した選択です。observableArrayは、保持しているオブジェクトを追跡し、オブジェクトが追加または削除されたときにリスナーに通知します。

これは、このコード行で行っているのと同じ注意の間違いです。これは、観察可能なものではなく、配列内のオブジェクトのプロパティにすぎないためです。 return item.ParticipationStatus == 'Active';

さらに、計算されたオブザーバブルがどのように機能するかを理解する必要があります。

  1. 計算されたオブザーバブルを宣言するたびに、KOはすぐにそのエバリュエーター関数を呼び出して初期値を取得します。

  2. エバリュエーター関数の実行中、 KOは、エバリュエーターが値を読み取るオブザーバブル（または計算されたオブザーバブル）のログを保持します。

  3. 評価者が終了すると、KOは、タッチした各オブザーバブル（または計算されたオブザーバブル）へのサブスクリプションを設定します。サブスクリプションコールバックは、エバリュエーターを再度実行するように設定されており、プロセス全体をステップ1にループバックします（適用されなくなった古いサブスクリプションを破棄します）。

  4. KOは、計算されたオブザーバブルの新しい値についてサブスクライバーに通知します。

したがって、計算された監視可能にする場合、変更を監視するために作成されたサブスクリプションは、監視可能な配列に対するサブスクリプションのみでしたself.padParticipant()。

UIの状態変化は変化に依存するためParticipationStatus、これは、このプロパティが配列内の各オブジェクト内の監視可能な要素である必要があることを意味します。そうでない場合、状態が変化したときに、計算機がその変化を認識し、 UIを更新します。

于 2013-03-27T02:51:28.410 に答える