11

シンプルなマスターディテールEmberアプリをまとめようとしています。一方にディレクトリツリー、もう一方にファイルリスト。

Emberは、コンテキストをビューにレンダリングするためのヘルパーをほとんど提供していません。それらのどれに使用できますか：

  1. ディレクトリツリーのサブツリー。
  2. 詳細リスト。

{{render view}}実際、ヘルパー{{view view}}とヘルパーの違い{{control view}}とそれらを適切に使用する方法について私が読むことができるドキュメントを誰かが教えてくれると非常に役立ちます。

どうもありがとう！

4

3 に答える 3

31

{{view "directory"}}現在のコントローラのコンテキスト内でビューをレンダリングします。

{{render "directory"}}シングルトンのコンテキスト内App.DirectoryViewでテンプレートを使用してビューをレンダリングしますdirectoryApp.DirectoryController

{{control directory}}レンダリングするたびにrender新しいインスタンスを作成するのと同じように動作します（毎回同じコントローラーインスタンスを使用するのとは異なります）。App.DirectoryControllerrender

2014年2月18日更新：{{control}}削除されました。

最後の2つのヘルパーは比較的新しいため、それらに関するドキュメントはあまりありません。ここで{{view}}ドキュメントを見つけることができます。

今あなたのユースケースを見て、私はあなたがこれらのヘルパーのどれも必要としないと思います。ネストされたルートと{{outlet}}ヘルパーを使用するだけで、機能するはずです。

App.Router.map(function(){
  this.resource('directories', function() {
     this.resource('directory', { path: '/:directory_id'}, function() {
       this.route('files');
     });
  });
});

このガイドに従って、これに基づいて構築できます。

更新：{{render}}モデルを渡すたびに新しいインスタンスを作成するようになりました。

于 2013-03-07T09:41:03.353 に答える
10

ヘルパーレンダリングの非常に良い説明については、パーシャル、アウトレット、およびテンプレートでこの質問を参照してください。

大まかな要約と同じように、これらのヘルパーをどのように使用するか：

{{render"navigation"}} ->この場所でNavigationControllerとNavigationViewをレンダリングします。これは、ナビゲーションなど、コントローラーとビューが変更されない場所に適したヘルパーです。

{{outlet "detailsOutlet"}} ->これにより、Components（Controller + View）をレンダリングできるスタブ/フック/ポイントが提供されます。ルートのrenderメソッドでこれを使用します。あなたの場合、あなたはおそらくこのように見えるかもしれない詳細なルートを持っているでしょう。これにより、DetailsViewを含むDetailsControllerがインデックステンプレートのアウトレット'detailsOutlet'にレンダリングされます。

App.DetailsRoute = Ember.Route.extend({
  renderTemplate: function() {
    this.render('details', {   // the template/view to render -> results in App.DetailsView
      into: 'index',          // the template to render into -> where the outlet is defined
      outlet: 'detailsOutlet',       // the name of the outlet in that template -> see above
    });
  }
});

{{view App.DetailsView}} ->これにより、現在のコンテキスト/コントローラーを保持しながら、指定されたビューがレンダリングされます。コンテキストを変更する場合があります。たとえば、マスターエンティティを使用して、その詳細を次のようなビューに渡します。

{{view App.DetailsView contextBinding = "masterEntity.details"}}

これは、アクション/イベントの処理などの独自のカスタムロジックを持つ、コンポーネントの特定の部分をサブビューにカプセル化する場合に役立ちます。

{{control}}コントロールは、使用されるたびに新しいコントローラーをインスタンス化することを知っていますが、あなたにぴったりなものはわかりません。また、それを使用するための良い例もありません。

于 2013-03-07T09:48:31.700 に答える
2

残り火{{render}}、{{template}}、{{view}}、{{control}}の違いを理解するには

この記事を参照できます

http://darthdeus.github.io/blog/2013/02/10/render-control-partial-view/

于 2013-06-25T04:25:35.003 に答える