1

私はASP.NETMVCSPAとKnockout.jsOSを初めて使用しますが、これは私が犯した単純な間違いかもしれません...

状況： Webサイトに2つのパーシャルビューがあり、すべてのパーシャルビューに独自のノックアウトViewModelが必要なので、巨大なViewModelを取得することはありません。

私の現在のViewModel：

/// <reference path="../_references.js" />

function MobileDeliveriesViewModel() {
   var self = this;

   // Data
   self.currentDelivery = ko.observable();
   self.nav = new NavHistory({
      params: { view: 'deliveries', deliveryId: null }
   });

   // Test
   self.foo = "FooBar"
   self.bar = "BarFoo"

   self.nav.initialize({ linkToUrl: true });

   // Navigate Operations
   self.showDeliveries = function () { self.nav.navigate({ view: 'deliveries' }) }
   self.showCustomers = function () { self.nav.navigate({ view: 'customers' }) }
}

function BarFooViewModel() {
   var self = this
   //MobileDeliveriesViewModel.call(self)

   self.bar2 = "BarFooTwo"
}

ko.applyBindings(new MobileDeliveriesViewModel());
ko.applyBindings(new MobileDeliveriesViewModel(), $('#BarFoo')[0]);
ko.applyBindings(new BarFooViewModel(), document.getElementById('BarFoo'));

My Index.cshtml：

<div data-bind="if: nav.params().view == 'deliveries'">
   @Html.Partial("_DeliveriesList")
</div>

<div class="BarFoo" data-bind="if: nav.params().view == 'customers'">
   @Html.Partial("_CustomersList")
</div>

<script src="~/Scripts/App/DeliveriesViewModel.js" type="text/javascript"></script>

私のCustomerPartialView：

<div id="BarFoo" class="content">
   <p data-bind="text: bar"></p>
   <p data-bind="text: bar2"></p>

   <button data-bind="click: showDeliveries, css: { active: nav.params().view == 'deliveries' }">Deliveries</button>
</div>

My DeliveriesPartialView：

<div class="content">
   <p data-bind="text: foo"></p>

   <button data-bind="click: showCustomers, css: { active: nav.params().view == 'customers' }">Customers</button>
</div>

これを実行すると、BarFooViewModelのbar2プロパティが認識されません...

ViewModelの最後に2つの異なるapplyBindingsを試しました。

誰かがアイデアを思いついたのですか、それともこれを行うためのより良い方法/パターンですか？

4

2 に答える 2

2

ページにJSエラーがありますか？

nav.params（）。view but params：{view：'deliveries'、deliveryId：null}-関数ではありません。

1ページでいくつかのビューモデルを使用する場合は、http：//www.knockmeout.net/2012/05/quick-tip-skip-binding.html？utm_source = feedburner＆utm_medium = feed＆utm_campaign = Feed％3A +KnockMeOut+を確認してください。 ％28Knock + Me + Out％29アクティクル。「stopBinding」を使用する必要があります

于 2012-10-04T10:48:59.283 に答える
0

同じセクションに複数のデータバインディングを適用しているようです。

ko.applyBindings(new MobileDeliveriesViewModel();

これにより、1ページのすべての要素にバインドされます。

ko.applyBindings(new MobileDeliveriesViewModel(), $('#BarFoo')[0]);

これは、div内のすべての要素にバインドしようとします

ko.applyBindings(new BarFooViewModel(), document.getElementById('BarFoo'));

これはまた、div内のすべての要素にバインドしようとします。

物事を単純にするために、単一のビューモデルを単一のhtmlセクションにバインドするようにしてください。同じhtmlセクションで2つのビューモデルをバインドしようとすると、正しく動作してトラブルシューティングを行うのが難しいことがわかりました。

Jack128の答えもいくつかの良い点を示しています。

于 2012-10-04T11:05:16.833 に答える