このjsfiddleには、以下に示すルーティング構造があります。この質問の下に表示されているアプリケーション テンプレートが表示され、投稿リンクをクリックすると、エラーがスローされます。
Uncaught Error: assertion failed: Cannot call get with 'id' on an undefined object.
このエラーは「post」リソースが原因で発生し、以下のコードに変更するとすべてが実行されます
this.resource('post', function(){});
しかし、私はそれを以下に示す形式で望んでいます。これは、エラーと未定義のオブジェクトをスローします。
this.resource('post', {path: 'posts/:post_id/'}, function(){})
これはルーター全体とjsfiddle です
EmBlog.Router.map(function() {
this.resource("posts", {path: '/posts'}, function(){
this.route('new');
this.route('edit', {path: '/:post_id/edit'});
this.resource('post', {path: 'posts/:post_id/'}, function(){
this.resource('comments', {path: '/comments'}, function(){
this.route('new');
this.route('edit', {path: ':post_id/comment/:comment_id'});
this.route('comment', {path: ':post_id/comment'});
});
});
});
});
EmBlog.Router.router.recognizer.names を実行したときのコンソール
Object {post.index: Object, posts.new: Object, posts.edit: Object, comments.new: Object, comments.edit: Object, comments.comment: Object…}
これはハンドルバーのテンプレートです
<script type="text/x-handlebars" data-template-name="application">
<h1>Hello from Application template</h1>
<p>{{#linkTo posts.index}}Posts{{/linkTo}}</p>
{{outlet}}
</script>
<script type="text/x-handlebars" data-template-name="posts">
<h1>Hello from posts template</h1>
<p>{{#linkTo post.index}} MyPost{{/linkTo}}</p>
{{outlet}}
</script>
<script type="text/x-handlebars" data-template-name="post">
<h1> Hello from a single post template</h1>
<p>{{#linkTo comments.index}} comments{{/linkTo}}</p>
{{outlet}}
</script>