1

「基本タブ」に問題があります。MVCのビューでタブをレンダリングしていて、3つの異なる部分ビューにKnockoutJSコードがたくさんあります。

私の問題は、各部分ビューがMVVMを作成し、バインディングを適用するため、Knockoutが他のKnockoutコードと競合していることです。

関連するタブが押されるまで、（部分ビューを使用して）DIVのレンダリングをスキップできる方法はありますか？

通常のビューのコードは次のとおりです。

<ul class="nav nav-tabs" id="myTab">
    <li class="active"><a href="#attributes">Attributes</a></li>
    <li><a href="#interestgroups">Interest groups</a></li>
    <li><a href="#categories">Categories</a></li>
</ul>
<div class="tab-content">
    <div id="attributes" class="tab-pane active">
        @Html.Partial("_AttributesPartial")
    </div>
    <div id="interestgroups" class="tab-pane">
        @Html.Partial("_InterestGroupsPartial")
    </div>
    <div id="categories" class="tab-pane">
        @Html.Partial("_InterestGroupCategoriesPartial")
    </div>
</div>

<script type="text/javascript">
    $(function () {
        $('#myTab a:first').tab('show');
    });

    $('#myTab a').click(function (e) {
        e.preventDefault();
        $(this).tab('show');
    });
</script>
4

1 に答える 1

2

注意すべきことは、1 つの引数だけで ko.applyBindings を複数回呼び出すことです。

たとえば、ページに複数のビュー モデルがある場合 (質問から推測します)、2 番目の引数としてコンテナー要素を渡して、スコープを設定する必要があります。

あなたのコメントによると、「表示された」イベントをリッスンする必要があるものを遅延ロードしたい場合。

(これは疑似コードです。詳細を入力する必要があります)

$('#attributes').on('shown', function (e) {
   initKOView(e.target);  // some logic to determine which viewModel to bind to.
})

function initKOView(target) {
   $(target).load('controller/_RenderPartial?path=' + target, function(data) {
      $(this).html(data);
      // Once the data comes back, apply your bindings and make sure to scope it.
      ko.applyBindings(viewModels[target], this);
   })
}

ここで説明したように、現在、バインディングのセット全体を破棄する方法は実際にはありません。そのため、引き続きビュー モデルのスコープを設定する必要があります。

https://github.com/SteveSanderson/knockout/issues/41#issuecomment-749171

次に、コントローラーに、PartialViewResult

public PartialViewResult _RenderPartial(string path)
{
    return PartialView(path);
}

もちろん、それぞれに個別のコントローラー アクションを設定して、パラメーター化された読み込みをスキップすることもできます。@Html.Partial()また、マスター ビューからもすべてのものを削除する必要があります。

于 2012-10-10T18:35:53.910 に答える