从父级转换时不会触发 Ember 子路由模型方法答案

【问题标题】：Ember sub route model method doesn't trigger when transitioning from parent从父级转换时不会触发 Ember 子路由模型方法
【发布时间】：2015-01-18 01:19:49
【问题描述】：

我有一个消息路由和消息子路由：

  // routes
  this.resource('messages');
  this.resource('message', { path: '/messages/:message_id' });

由于后端架构（我无法控制），我需要为消息（实际上是一组消息预览 - 没有消息，只有主题）和完整的消息对象调用单独的 ajax 调用。

但是当来自消息路由时，Ember 会忽略消息路由模型方法？它确实在直接调用该消息路由时触发它。如何让 Ember 始终调用消息路由模型方法？

这是我目前拥有的：

App.MessageRoute = Ember.Route.extend({
  model : function (params) {
    return Ember.$.ajax({
      url: '/getMessage.do'
    });
  },
  setupController: function (controller,  model) {
    console.log('model: ', model);
    console.log('model set? : ', this.get('modelLoaded'));
    var message = App.Message.create({
      message: model.data.content
    });
    controller.set('model', message);
  }
});

App.MessagesRoute = Ember.Route.extend({
  model : function (params) {
    return Ember.$.ajax({
      url: '/getMessagePreveiws.do'
    });
  },
  setupController: function(controller, model){
    var messages = [];
    model.data.forEach(function (message) {
      messages.push(App.Message.create({
        id: message.id,
        subject: message.subject,
        date: message.date_created,
        read: message.read,
        deleted: message.deleted
      }));
    });
    controller.set('model', messages); 
  }
});

【问题讨论】：

你能发布链接或转换你到消息路由的代码吗？
@rogMaHall 真的没有代码。只是链接到助手：{{#each}} {#link-to 'message' this}}{{subject}}{{/link-to}} {{/each}}
@rogMaHall 但是如果 setupController 方法不会调用呢？

标签： javascript ember.js

【解决方案1】：

Ember 设计了 model 钩子，用于在您没有路线时为您的路线获取适当的数据。在您的情况下，您通过 link-to 助手将数据作为参数传递，因此 Ember 决定不需要运行 model 挂钩，因为它已经拥有数据。

另一方面，setupController 应该总是开火（至少我没有发现其他情况......）。由于听起来您可以直接访问 url 并且它可以工作，因此请保持模型钩子的原样，但将其内容与承诺添加到 setupController 钩子：

setupController: function (controller,  model) {
  //Check if model has the data you were expecting
  //and if it doesn't, use the model hook logic
  if(Ember.isEmpty(model.data.content)){  
    Ember.$.ajax({
      url: '/getMessage.do'
    }).then(function(response){ // wait for the response... 
      var message = App.Message.create({
        message: response.data.content
      });
      controller.set('model', message);
    });
  } else {
    var message = App.Message.create({
      message: model.data.content
    });
    controller.set('model', message);
  }
}

试试看。

您还可以查看 beforeModel 和 afterModel 以更好地了解路由过程以及如何将它们用作替代方案，尽管我认为 setupController 最适合您正在做的事情。

【讨论】：