いくつかの Tumblr json を取得し、投稿を一覧表示してから、デフォルトの投稿ビューに戻るリンクを使用して投稿の詳細ビューに移動できるようにする単純な Ember アプリケーションを作成しています。
現在の問題は、{{action}}handlebars テンプレート タグを使用すると、'showHome' ルートに戻るリンクが機能せず、'showPost' アクションが、アクションでコンテキストとして指定されたものではなく、json の最後の投稿を表示することです。鬼ごっこ。
ここに私のテンプレートがあります：
<script type="text/x-handlebars" data-template-name="main-tmpl">
<h1>
<a {{action showHome}}>{{view.content.title}}</a>
</h1>
{{&view.content.description}}
{{outlet}}
</script>
<script type="text/x-handlebars" data-template-name="post-tmpl">
{{#if view.content.is_photo }}
{{#if view.detail }}
<img {{bindAttr src="view.content.photo-url-500"}}>
{{else}}
<a {{action showPost view.content href=true}} class="thumbnail">
<img {{bindAttr src="view.content.photo-url-75"}}></a>
{{/if}}
{{/if}}
</script>
ここに私のルートがあります：
App.Router = Ember.Router.extend({
root: Ember.Route.extend({
showHome:Ember.Route.transitionTo('index'),
showPost:Ember.Route.transitionTo('postDetail'),
loading: Em.Route.extend({
connectOutlets: function(router, context){
router.get('applicationController').connectOutlet('loading', context)
}
}),
index: Em.Route.extend({
route: '/',
deserialize:function(router, params) {
var deferred = jQuery.Deferred(),
resolve = function() { console.log("resolved"); deferred.resolve() }
/* Cut for brevity [...] */
return deferred.promise()
},
connectOutlets:function(router) {
router.get('applicationController').connectOutlet('tumbleLog')
router.get('tumbleLogController').connectOutlet('posts')
}
}),
postDetail:Em.Route.extend({
route:'/post/:id',
connectOutlets:function(router,post) {
console.log('my post is', post)
router.get('tumbleLogController').connectOutlet('postDetail', post)
}
})
})
})
そして、ここにフィドルがあります：http://jsfiddle.net/colinkahn/PegYL/