2

Knockout、pagerjs、および history.js を使用して SPA をセットアップしようとしています。ただし、 を含むリンクをクリックするとdata-bind="'page-href': '/somepath'"、JS エラーが発生します。

オブジェクト関数 History() { [ネイティブ コード] } にはメソッド 'pushState' がありません

これは、私が pagerjs を正しく初期化していないことを示していますが、デモを正しくフォローしていると思いました。pagerjs を初期化する方法は次のとおりです。

define(['knockout', 'pager', 'history'], function (ko, pager, history) {
    // [define my view model]

    pager.useHTML5history = true;
    pager.Href5.history = history;
    pager.extendWithPage(viewModel);

    // [apply bindings]

    pager.start();
});

history.js を AMD モジュールとしてロードできるようにするために、history.js の最後にこれを追加しました。

// [original history.js code]

define(function() { return History; });

ただし、pagerjs が呼び出そうとHistoryするメソッドがないことに気付きました。pushState

pagerjs と history.js を統合する正しい方法は何ですか?

4

1 に答える 1

3

ありがたいことに、この単体テスト コードを見つけました。これが私が学んだことです：

  1. <base href="..."/>ベース URL を指定するには、 が必要です。
  2. history.jsGit にある raw ファイルを含めるべきではありませんが、jquery.history.jsバンドルを使用してください。
  3. を使用する代わりに、 をpager.start()使用してpager.startHistoryJs()ください。

更新された初期化コードは次のとおりです。

define(['knockout', 'pager', 'history'], function (ko, pager, history) {

    var viewModel = /* [Create my view model] */;

    pager.useHTML5history = true;
    pager.Href5.history = history;
    pager.extendWithPage(viewModel);

    ko.applyBindings(viewModel);

    pager.startHistoryJs();
});

そして、これが私がAMD化した方法ですjquery.history.js:

define(['jquery'], function () {

    // [Original code]

    return History;
});
于 2013-10-02T17:19:17.353 に答える