这是我的代码。我面临两个问题。 1.当我从表单中单击浏览器后退按钮时,不呈现我的formList 2.当我刷新页面时,它没有再次调用render方法。
App.Router.map(function() {
this.resource('formList', { path: '/formList' }, function() {
this.route('form');
});
});
App.IndexRoute = Ember.Route.extend({
redirect : function() {
this.transitionTo('formList');
}
});
App.FormListFormRoute = Ember.Route.extend({
renderTemplate: function(){
this.render('formListForm', {
into:'application',
outlet: 'appBody'
});
}
});
App.FormListRoute = Ember.Route.extend({
renderTemplate: function(){
this.render('formList', {
into:'application',
outlet: 'appBody'
});
}
});
答案 0 :(得分:1)
formList
是formListForm
的父级。它应该在dom中存在。不幸的是,当您访问formListForm
时,您要从dom中删除formList
,但Ember并不知道这一点,并且由于您的路由器formList
已经存在而受到影响在页面中,所以它不会浪费任何时间重新渲染已存在的东西。
尽管如此,手动渲染并不是必需的。默认情况下,Ember会将树中的每个路径/资源渲染到父资源的空{{outlet}}
。从应用程序模板(应用程序的根目录或/
)开始。我重写了你的例子
<script type="text/x-handlebars" data-template-name='application'>
<h2> Welcome to Ember.js</h2>
{{link-to 'Form List Form' 'formList.form'}}
{{outlet}}
</script>
<script type="text/x-handlebars" data-template-name="formList">
<h2 class='formList'> Form List</h2>
<h4 class='formList'>Info that always shows up in the form list</h4>
{{outlet}}
</script>
<script type="text/x-handlebars" data-template-name="formList/index">
<h4 class='formListIndex'>Info that only shows up in the form list when visiting /formList</h4>
</script>
<script type="text/x-handlebars" data-template-name="formList/form">
<h4 class='formListForm'> Viewing the form route</h4>
</script>