29

私は最近emberjsについてたくさん読んでいますが、何かがはっきりしていません。テンプレートをレンダリングする方法はいくつかあると感じています。誰かがこれらの違いを説明できますか?

{{render}}
{{partial}}
{{template}}
{{outlet}}

pre4を使用しているので、これらのキーワードの一部が廃止された場合は、お知らせください。

4

3 に答える 3

56

以下を検索することで、Ember.JSソースでこれらすべてを検索できますEmber.Handlebars.registerHelper('?'。たとえば、template定義されている部分を見つけるには、 Ember.Handlebars.registerHelper('template'を検索します。

{{レンプレート}}

に似ていますが、ハッシュ{{partial}}で定義したテンプレートを探します。Ember.TEMPLATESソースコードから例を見ることができます:Ember.TEMPLATES["my_cool_template"] = Ember.Handlebars.compile('<b>{{user}}</b>');そしてそれをそのようにレンダリングすることができます。

@deprecated{{template}}のささやきを聞きましたが、現時点ではその情報をどこで見つけたかわかりません。しかし、私がこれを使用していることに気付いたことがないことは言及する価値があります。代わりに私は好みます。{{partial}}

編集:現在、 @deprecatedではないように見え 3df5ddfd4fます。私の間違い!

{{部分的}}

これは、とがそれを呼び出したコンテキストから継承されるという点でアプローチと{{render}}は異なります。たとえば、にいて、ユーザーテンプレートにパーシャルをロードすると、とは両方ともパーシャルに渡されるため、現在の親とまったく同じ情報にアクセスできます。controllerviewUserRouteUserViewUserController

部分的な名前は、定義されている場合、アンダースコアで始まります。たとえば、Profileパーシャルにはdata-template-nameof:data-template-name="_profile"がありますが、ビューにとして挿入されます{{partial "profile"}}

{{出口}}

あなたはおそらくこれをたくさん使っていることに気付くでしょう。outletこれは主に、ユーザーの操作に基づいて頻繁に変更される場合に使用されます。this.transitionTo別のページ( / )に遷移することにより{{#linkTo}}、Emberはビューをに挿入し、関連すると{{outlet}}を添付します。controllerview

例として、 /#/ petsに移行する場合、デフォルトでは、EmberはをにロードしPetsView{{outlet}}をアタッチしますPetsController。これらはすべて、を初期化した後PetsRoute、ビューを初期化してコントローラーを見つける前に指示を受け取ります。

{{与える}}

これはとの混合物{{outlet}}です{{partial}}。これは、他のページに切り替わらない静的ページに使用されますが(outletそうするように)、コントローラーとビューを継承しません(そうするようにpartial)。

例を挙げたほうがいいです。ナビゲーションがあるとしましょう。通常、ナビゲーションは1つだけで、別のナビゲーションに変更されることはありませんが、ナビゲーションに独自のコントローラーとビューを持たせ、コンテキストから継承しないようにする必要があります(おそらくApplicationRoute)。したがって、ナビゲーション({{render "navigation"}})を挿入すると、EmberがアタッチApp.NavigationControllerされApp.NavigationViewます。

概要

  • template:グローバルハッシュを参照し、ビューが見つかったときにビューを挿入します(おそらくすぐに@deprecatedになります);
  • partial:複雑なビューを分割するために使用され、親からコントローラー/ビューを継承します(にいる場合はUserController、パーシャルもこれとそれに関連付けられたビューにアクセスできます)。
  • outlet:最も広く使用されており、ページを他のページにすばやく切り替えることができます。関連するコントローラー/ビューが添付されています。
  • render:アウトレットに似ていますが、アプリケーション全体で永続的なページに使用されます。関連するコントローラー/ビューを想定し、それらを継承しません。

私はそれらをうまく説明しましたか?

明確にするために:

  • 部分的:継承されたコントローラー、継承されたビュー、切り替え不可。
  • アウトレット:関連するコントローラー、関連するビュー、切り替え可能。
  • レンダリング:関連するコントローラー、関連するビュー、切り替え不可。
于 2013-02-10T20:50:22.943 に答える
4

ガイドはまた、ここでいくつかの有用な情報を提供します!以下は簡単な要約です。

ここに画像の説明を入力してください

于 2014-01-13T05:17:31.807 に答える
4

templateさまざまなテクニックをいつ使用するかを明確にするのに本当に役立つ別の回答をここに投稿したいと思いました-

ルート

ルートを使用するのは、本格的なルートが必要な場合です。「ルート」には一意のURLがあり、次のタイプの生成されたクラスまたはユーザー定義のクラスで構成されます-

  1. ルート(Ember.Route)
  2. コントローラー(Ember.Controller || Ember.ArrayController || Ember.ObjectController)
  3. ビュー(Ember.View)
  4. テンプレート(ハンドルバーテンプレート)

{{与える}}

{{render}}ビューが必要であるが、コントローラーにいくつかの機能を提供する必要がある場合は 、ヘルパーを使用します。一意のURL{{render}}なく、次のもので構成されています-

  1. コントローラー(Ember.Controller || Ember.ArrayController || Ember.ObjectController)
  2. ビュー(Ember.View)
  3. テンプレート(ハンドルバーテンプレート)

{{成分}}

{{component}}レンダリングされるコンテキストに関係なく存在する、一般的に再利用されるテンプレートを作成する場合は、ヘルパーを使用します。適切な例としては、小売Webサイトを構築していて、それがレンダリングされる場所に依存しない製品ビューが必要な場合があります。 一意のURLもあり{{component}}ませcontrollerが、代わりにcomponentクラスがあり、次のもので構成されます-

  1. コンポーネント(Ember.Component)
  2. テンプレート(ハンドルバーテンプレート)

{{部分的}}

{{partial}}マークアップを再利用するだけの場合は 、ヘルパーを使用してください。一意のURLもコンポーネントのような特別なバッキングも{{partial}}持たず、次のもので構成されます-

  1. テンプレート(ハンドルバーテンプレート)
于 2014-03-26T18:31:10.967 に答える