ember.js - 如果给定的 ID 无效则重定向

标签 ember.js router

我有以下路线

App.Router.map(function() {
  this.resource('gradebooks', function() {
    this.resource('gradebook', { path: ':gradebook_id' });
  });
});

App.GradebooksRoute = Em.Route.extend({
  model: function() {
    return this.store.find('gradebook');
  }
});

App.GradebookRoute = Em.Route.extend({
  model: function(params) {
    var id = params.gradebook_id;
    var gradebook = this.store.find('gradebook', id);
    var self = this;
    gradebook.then(null, function(reason) {
      self.transitionTo('gradebooks');
    });
    return gradebook; 
  }
})

模板:

<ul>
  {{#each}}

  <li {{bind-attr class="isActive:active"}}>
    {{#link-to "gradebook" this}}
      {{title}}
    {{/link-to}}
  </li>

  {{/each}}
</ul>

{{outlet}}

除非给出了无效的 id,否则它工作得很好。 (例如#/gradebooks/invalid_id)。

目前,重定向效果很好(我确实收到错误加载路线时出错:TypeError:无法读取未定义的属性“id”,但它仍然会重定向。但是,生成的成绩簿列表列表中有无效的成绩册。

如果我手动导航到 #/gradebooks/invalid_id_1#/gradebooks/invalid_id_2#/gradebooks/invalid_id_3 等,无效的成绩簿每次都会添加到成绩簿列表中。

有什么想法吗?或者有更好的解决方案吗?

最佳答案

与其手动处理 find 模型,不如让 ember 来做,如果 find 会触发错误事件 promise 被拒绝

App.GradebookRoute = Em.Route.extend({
  model: function(params) {
    var id = params.gradebook_id;
    return this.store.find('gradebook', id);
  },
  actions: {
    error: function(reason) {
      alert(reason); // "FAIL"

      // Can transition to another route here, e.g.
      // transitionTo('gradebooks');

      // Uncomment the line below to bubble this error event:
      // return true;
    }
})

更多信息http://emberjs.com/guides/routing/asynchronous-routing/

关于ember.js - 如果给定的 ID 无效则重定向,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22415987/

相关文章:

javascript - Ember JS 入门 - 屏幕闪烁

python - 如何使用命令或python在OpenWrt中添加用户?

javascript - Vue js路由到另一个页面后不重新渲染页面高度

vue.js - 如何禁用基于 Nuxt.js 自动文件的路由生成以支持手动生成的 routes.js 文件?

javascript - Emberjs 相当于 Angular 过滤 ng 模型搜索

ember.js - 如何在不使用 View 的情况下将 classNames 添加到页面的第一个元素?

ember.js - 将普通 JS 对象数组转换为 Ember.js ArrayController

javascript - 修改 Controller 属性时,Ember 不更新模板

node.js - 将路由器指向 Node.js 服务器

javascript - React 路由器链接强制更新