0

私はアプリケーションを構築しており、Knockout から始めています。ページングを実装する必要がある段階に来ています。Knockout でそれを行うためのデファクト ライブラリは Pager.js のようです。

Pager は優れており、非常に使いやすいですが、Pager ソリューションを見つけることができなかったユース ケースがあります。

多くのページでは、特定のコンテンツをページ上の複数のバラバラな要素で表示できるようにしたいと考えています。(「ばらばら」が適切な用語かどうかはわかりません。実際には、DOM ツリーの完全に分離したブランチのように、まったく接続されていない要素を意味します。) たとえば、特定のものをヘッダーに表示したい場合があります。フッター、または Pager がレンダリングするメイン UI とともにメニュー。

これまでのところ、Pager はページを 1 つの要素のみにリンクしているように見えます。それは、どのページがアクティブであるかに基づいて表示/非表示を切り替える要素です。

切り離された複数の要素を Pager で表示/非表示にする方法はありますか? これを行うには、コールバックなどに頼る必要がありますか? （Pagerがページを表示/非表示にするときのコールバックがあることは知っています。これを使用してこれを実現できると思いますが、Pagerがこれを処理してくれればもっと良いでしょう。）

Pager がこの使用例を実際にサポートしていない場合、Knockout と互換性のある別の同様のライブラリを試してみてください。または、これを完全にサポートする Knockout の別の代替手段 (AngularJS、Ember など) はありますか?

EDIT：Emberを見て、私が探しているのは、ここで説明されているものとその「アウトレット」機能（ページの最後の例）です。そのため、Knockout と同様の機能を探しています。Knockout コールバックのいくつかを使用してこれを模倣できると思いますが、物事を移動したり、非表示/表示したりするために、おそらく多くの jQuery が必要になるでしょう。時間が経つにつれてアプリケーションが大きくなるにつれてメンテナンスの頭痛の種になるので、私はむしろそれをする必要はありません.

4

1 に答える 1

1

はい、達成するのは非常に簡単です。http://knockoutjs.com/documentation/binding-context.htmlを読む

基本的に、 を使用する$parentか$parents[x]、最終的に$rootは、コンテキストとして使用しているオブジェクトのレベルにないオブザーバブルにアクセスする必要があります。

以下に例を示します (pager.js を使用しても使用しなくても、動作は変わりません)。

var viewModel = {
  user: {
    id: ko.observable(1),
    name: ko.observable('John')
  }
  menu: {
    links: {
      about: 'about.html',
      index: 'index.html'
    }
  }
};

この HTML で:

<div id="header">
  <p>Your name is <span data-bind="text: user.name"></span></p>
</div>
<div id="menu" data-bind="with: menu">
  <p>Your name is still <span data-bind="text: $parent.user.name"></span></p>
  <p>Your name is still <span data-bind="text: $parents[0].user.name"></span></p>
  <p>Your name is still <span data-bind="text: $root.user.name"></span></p>
</div>
于 2014-05-24T03:25:07.020 に答える