4

ember.jsでアプリを作成しています。PRE.2から始めましたが、最終的にember-data v11を使用したため、ember固有のマスターにアップグレードしました。これは、新しいv2ルーターインターフェイスに変更する必要があることを意味しました(補足として、これは非常に優れていると思いますので、ありがとうございます)。

私はそれがどのように機能するかを理解しようとしていくつかの問題を抱えています、私はガイドの奥深くにいますが、私が頭を悩ませることができないいくつかの矛盾があります:

1)

ルートマップの設定に使用される規則は2つあるようです。

「テンプレート」セクションでは、match()。to()インターフェースが使用されます

App.Router.map(function(match) {
  match('/').to('index');
  match('/posts').to('posts');
  match('/posts/:post_id').to('post');
});

(この方法はTom Daleの要点でも使用されています)

「ルーティング」セクションでは、リソース/ルートインターフェイスが使用されます。

App.Router.map(function() {
  this.resource('posts', function() {
    this.route('new');
  });
});

ここでは、名詞ルートには「リソース」を使用し、動詞ルートには「ルート」を使用する必要があると述べています。

次に、「別のURLへのリダイレクト」セクションでは、この名詞/動詞の規則に従っていません。

App.Router.map(function(match) {
  this.resource('topCharts', function() {
    this.route('choose', { path: '/' });
    this.route('albums');
    this.route('songs');
    this.route('artists');
    this.route('playlists');
  });
});

私の最初の質問は:

今後、ルートを作成するための適切な規則は何ですか?

私の2番目の質問はそれに続き、私のアプリケーションにより関連性があります。

トップレベルの「リソース」ルートからネストされた「ルート」ルートにリンクして、適切なモデルを通過するにはどうすればよいですか?

(この例は、「テンプレート」ドキュメントの「リンク」セクションにありますが、これはmatch()。to()インターフェースに関連しており、特にリソース/ルートインターフェースを使用しています)

これが私の例です:

ストリームに基づいて単純なサイト構造を作成しました。ストリームは、詳細、一連の投稿、ハンドル、および履歴で構成されています。私のルーティングは次のように設定されています:

App.Router.map(function() {
  this.resource('streams');
  this.resource('stream', { path: '/stream/:stream_id' }, function(){
    this.route('details');
    this.route('posts');
    this.route('handles');
    this.route('history');
  });
});

私のストリームルートは次のようになります。

App.StreamsRoute = Ember.Route.extend({
  model: function() { 
    return App.Stream.find(); 
  },
  setupController: function(controller, model) { 
    controller.set('content', model); 
  }
});

およびテンプレート:

<script type="text/x-handlebars" data-template-name="streams">
  <ul>
  {{#each stream in controller}}
    <li>{{#linkTo "stream" stream}} {{stream.title}} {{/linkTo}}</li>
  {{/each}}
  </ul>
</script>

私のストリーム(単一)ルート:

<script type="text/x-handlebars" data-template-name="stream">
  <nav>
    {{#linkTo "stream.details" }}Details{{/linkTo}}
  </nav>
  {{outlet}}
</script>

ここで、サブルートの「詳細」にリンクしたいのですが、モデル(ストリーム)がこのサブルートに渡されるように、linkToに何を配置すればよいかわかりません。

App.StreamDetailsRoute = Ember.Route.extend({ });

私の「詳細」テンプレートは、ストリームオブジェクトからいくつかの属性を表示するだけです。

<script type="text/x-handlebars" data-template-name="stream/details">
  <h2>Stream Details</h2>
  <p>Id: {{id}}</p>
  <p>Title: {{title}}</p>
</script>

また、投稿、履歴、サブルートの処理にリンクし、ストリームモデルに基づいてこれらの集計を表示できるようにします。これを行う方法が正確にはわかりません。アイテムを表示するにはsetupControllerを使用する必要があると思いますが、ストリームオブジェクトをこれらのサブルートに移動する方法がわかりません。

4

1 に答える 1

2

今後、ルートを作成するための適切な規則は何ですか?

http://emberjs.com/guides/routing/defining-your-routes/で説明されているリソース/ルートアプローチ

トップレベルの「リソース」ルートからネストされた「ルート」ルートにリンクして、適切なモデルを通過するにはどうすればよいですか?

最初のパラメーターとしてルートの名前を指定し、その後に必要なコンテキストを指定します。したがって、この例では、ストリームテンプレートから「stream.details」へのリンクを作成するときにthis、コンテキストとして指定する必要があります。

{{#linkTo "stream.details" this}}Details{{/linkTo}}

http://emberjs.com/guides/templates/links/で説明されているアプローチは、まだ基本をカバーしています。

疑わしい場合は、link_helperのテストケースを確認することをお勧めします。例:https ://github.com/emberjs/ember.js/blob/master/packages/ember/tests/helpers/link_to_test.js#L249

于 2013-01-17T13:16:55.290 に答える