想要调用setupController或模型钩子

时间:2014-02-09 13:40:48

标签: ember.js

我有以下路线和控制器:

var App = App || Ember.Application.create();

App.Router.map(function(){
  this.resource('posts', function(){
    this.route('new', { path: '/new'});
  });
});

App.PostsRoute = Ember.Route.extend({
  model: function () {
    return $.getJSON('/api/posts');
  },
  setupController: function(controller, model) {
    $.getJSON('/api/posts').done(function(data) {
      controller.set('model', data);
    });
});

App.PostsNewController = Ember.Controller.extend({
  actions: {
    addPost: function (file) {
      var self = this;
      $.ajax({
        type: 'POST',
        url: '/api/posts',
        data : {
         id: this.get('id'),
         title: this.get('title'),
         author: this.get('author'),
         contents: this.get('contents')
        }
      }).done(function(res){
        self.transitionToRoute('posts');
      });
    }
  }
});

我想要做的是在用户成功保存新帖子后,在浏览器中调用“帖子”路径刷新帖子列表。

所以我使用“self.transitionToRoute('posts')”在PostsRou​​te中调用模型钩子或setupController,但两种方法都不会被调用。

我做错了什么? 提前谢谢。

1 个答案:

答案 0 :(得分:2)

由于您已经在帖子路线上,因此Ember认为没有必要重新获取模型。此外,控制器已经设置好,并且它已经有了模型,因此它没有理由调用它。基本上它避免浪费电话。我个人也建议你不要添加回调(除非你期待其他用户的其他帖子)。

示例1:只需将新帖子添加到当前帖子列表

needs: ['posts'],
actions:{
  addPost: function (file) {
    var self = this,
        data = {
          id: this.get('id'),
          title: this.get('title'),
          author: this.get('author'),
          contents: this.get('contents')
        };
    $.ajax({
      type: 'POST',
      url: '/api/posts',
      data : data
    }).done(function(res){
      // just push the new data
      self.get('controllers.posts').pushObject(data);
      self.transitionToRoute('posts');
    });
  }
}

示例2:通过发送操作再次获取所有帖子,该操作将冒泡到帖子路径

actions:{
  addPost: function (file) {
    var self = this,
        data = {
          id: this.get('id'),
          title: this.get('title'),
          author: this.get('author'),
          contents: this.get('contents')
        };
    $.ajax({
      type: 'POST',
      url: '/api/posts',
      data : data
    }).done(function(res){
      self.send('updatePosts');
      self.transitionToRoute('posts');
    });
  }
}

App.PostsRoute = Ember.Route.extend({
  model: function () {
    return $.getJSON('/api/posts');
  },
  actions: {
    updatePosts: function(){
      var controller = this.get('controller');
      this.model().then(function(data){
        controller.set('model', data);
      });
    }
  }
});