1

私はこのようなシナリオを持っています。

  1. ページが #Action に移動したときに最初に読み込まれます。
  2. 選択アクションが実行されると、data-bind="with タグが読み込まれます"
  3. ユーザーが「何かをする」アクションをクリックすると実行されます。「parentNode」全体を置き換えるもの
  4. ここで、ユーザーがクリックして戻り、sammy.js がハッシュタグ #Action/:id に気付くと、#Action をロードしてメイン ビューを取得し、id を選択して data-bind="with" をロードする必要があります。再度タグ付けします。

これどうやってするの？

現在、ページは「Action/:id」に戻りますが、メイン ビューが読み込まれていないため、何もしません。「this.redirect("#Action") を使用してノードを選択しましたが、機能しません。

<div id="parentNode">
    <ul data-bind="foreach: items">
       <li data-bind="click: $root.selectItem">
          <h2><span data-bind="text: Sometext"></span></h2>
       </li>
    </ul>
    <div data-bind="with: selectedItem">
       <a data-bind="click: loadSomething">Do Something</a>
    </div>
</div>

私のビューモデルにはこれがあります：

viewModel.selectItem= function (item) {
    location.hash = "Action/" + item.id();
}

viewModel.loadSomething = function () {
    location.hash = "Action/" + viewModel.someSelectedItem().id() +"/SubAction";
}

$.sammy(function () {

  this.get('#Action', function () {
     $.ajax({
         url: '@Url.Action("GetMainView")',
         type: "GET",
         data: self.someId(),
         dataType: "json",
         success: function (result) {
           $("#parentNode").html(result.message);
         }
   });

  this.get('#Action/:id', function () {
      var id = this.params["id"];
      var matchItem = ko.utils.arrayFirst(viewModel.MainItems(), function (item) {
                return item.id() == id;
       });

       viewModel.someSelectedItem(matchItem);
  });

  this.get('#Action/:id/SubAction', function () {
    var id = this.params['id'];
    $.ajax({
         url: '@Url.Action("ViewSomething")',
         type: "GET",
         data: { id: id },
         success: function (result) {
             $('#parentNode').html(result.message);
         }
    });
 });
});

サンプルコード: https://skydrive.live.com/redir?resid=33048714B5BF3B4B!913

再現する手順：

  1. リストされた項目 (項目 1、項目 2、項目 3) のいずれかの下にある「サブ項目」を選択します。
  2. ラベル付けされたサブアイテムのいずれかを選択します (サブアイテム 1、サブアイテム 2)
  3. 部分ビューは、「サブアイテム {x}」と「次のビュー」リンクで表示されます
  4. 「次のビュー」リンクをクリックします。
  5. 「次の部分図」が表示されます。
  6. 戻るボタンを押します。

私がやろうとしているのは、サブアイテムをロードして「サブアイテム1」ビューを選択することです。

  1. リスト項目
4

1 に答える 1

0

これが機能するかどうかはわかりませんが、メイン ビューをロードする別のヘルパー関数を作成していただけないでしょうか。すると、以下のようなケースになります。

this.get('#Action', function () {
    LoadMainView();
}

this.get('#Action/:id', function () {
    if($('#parentNode').length == 0) {
        LoadMainView(function() {
             var id = this.params["id"];
             var matchItem = ko.utils.arrayFirst(viewModel.MainItems(), function (item) {
                 return item.id() == id;
             });

             viewModel.someSelectedItem(matchItem);
        })
    }
}

LoadMainView 関数はコールバックを受け入れ、次のようになります。

function LoadMainView(callback) {
    $.ajax({
        url: '@Url.Action("GetMainView")',
        type: "GET",
        data: self.someId(),
        dataType: "json",
        success: function (result) {
            $("#parentNode").html(result.message);
            if(typeof callback == "function") {
                callback();
            }
        }
    });
}

あなたのソリューションでこれをテストすることはできませんでした（開くとエラーが発生します）が、それがあなたが求めていることを行うための一般的な構造だと思います。

于 2013-02-28T13:52:16.427 に答える