模板仅在刷新页面后呈现

时间:2013-10-13 14:21:11

标签: javascript ember.js handlebars.js

我希望获得大学名单,点击其中一个大学之后,这个名单旁边的专业名单应该显示。点击其中一个专业后,在这两个列表旁边显示主题列表。但是我想在路由方面做错了。点击其中一个大学URL更改后,主要列表没有显示。但刷新页面后(使用此URL)它可以正常工作。这是代码: http://jsbin.com/AQAref/1/edit

1 个答案:

答案 0 :(得分:2)

像其他人说的那样,你的jsbin不起作用。很明显真正的问题在于你的链接。如果它在您刷新时有效,但在您单击链接时则无效,那么差异就是模型的来源。刷新时,模型来自模型钩子。使用链接导航时,模型由link-to语句提供。

在您的情况下,如果您刷新页面,您将从大学模型钩子中获得特定大学的专业。如果您从您的页面点击大学,大学模型将被发送到大学资源,而不是该大学的专业。

所以要么这需要说专业

{{#each}}
   <li {{bindAttr id="id"}}>
     <div class="list-element-title">
        {{#link-to 'university' this.majors}}{{name}}{{/link-to}}
     </div>
   </li>
{{/each}}

而不是

{{#each}}
   <li {{bindAttr id="id"}}>
     <div class="list-element-title">
        {{#link-to 'university' this}}{{name}}{{/link-to}}
     </div>
   </li>
{{/each}}

或者你的路线需要返回大学,但我猜测路线模型钩子是正确的,因为你说它适用于刷新。

 App.UniversityRoute = Ember.Route.extend({
  model: function(params) {
    var majors = universities.findBy('id', params.univ_id).majors;
    return majors;
  }
 });

我没有查看其余代码,但请确保通过链接发送相同的模型,如果通过模型钩子获得模型,则可以获得相同的模型。