現在、次のようなテスト用の Ember アプリをセットアップしています。
App = window.App = Ember.Application.create();
App.Router.map(function() {
this.resource('subscriptions', { path: '/' }, function() {
this.route('media', { path: '/:photo_id' });
});
});
App.SubscriptionsRoute = Ember.Route.extend({
model: function() {
return App.Subscription.findAll();
}
});
App.SubscriptionsMediaRoute = Ember.ObjectController.extend({
model: function(params) {
return App.Subscription.find(params.photo_id);
},
serialize: function(model) {
return { photo_id: model.photo_id };
}
});
App.Subscription = Ember.Object.extend();
App.Subscription.reopenClass({
findAll: function(id) {
var subs = Ember.A([
App.Subscription.create({ id: 1, photo_id: 221, name: "Test 1" }),
App.Subscription.create({ id: 2, photo_id: 222, name: "Test 2" }),
App.Subscription.create({ id: 3, photo_id: 223, name: "Test 3" })
]);
return subs;
}
});
アイデアは、サブスクリプションのリストを表示することであり、それぞれが最終的にいくつかのメディア (画像) にリンクして、正しいルートにアクセスしたときに表示されます。サブスクリプションのリストを次のように表示しています。
<script type="text/x-handlebars" data-template-name="subscriptions">
<div class="col-3">
<div class="list-group">
{{#each subscription in controller}}
{{#linkTo 'subscriptions.media' subscription classNames="list-group-item"}}
{{subscription.name}}
{{/linkTo}}
{{/each}}
</div>
</div>
<div class="col-9">
{{outlet}}
</div>
</script>
<script type="text/x-handlebars" data-template-name="subscriptions/media">
Display photos here -- NOT RENDERING --
</script>
すべて問題ないように見えますが、何らかの理由でsubscriptions/media
、リンクをクリックしてもテンプレートがサブスクリプション アウトレットに表示されません。参照用の jsbin は次のとおりです: http://jsbin.com/ubumag/3/edit
ポインタはありますか?前もって感謝します。