Question

我有一个表单，访问者可以通过典型的“我接受ToS”复选框和链接发表评论。链接将转换为带有ToS文本的新路由。

我在加载带有表单的路由时创建我的注释记录。我这样做，所以我的模板可以加载正确的默认设置（例如，有一个性别单选按钮，由于Ember数据屏幕，设置为正确的值）。

App.CommentRoute = Ember.Route.extend({
  model: function() {
    return this.store.createRecord('comment');
  }
  actions: {
    create: function(comment) {
      comment.save();
    }
  }
});

评论模型：

App.Comment = DS.Model.extend({
  body: DS.attr("string"),
  gender: DS.attr("string", {defaultValue: "M"}),
});

模板：

<form {{action "create" this on="submit"}}>
  ...
</form>

现在，当人们从ToS页面单击后退按钮时，所有表单字段都会在加载新模型时清空。保存表单或重新加载表单后我确实想要这种行为，但显然不是在使用后退按钮时。我通过保持全球状态来解决这个问题，但觉得应该有更好的方法。有什么提示吗？

Answer 1

有很多方法可以解决这个问题，所以我希望得到一些其他答案。我个人不会以新纪录开始这条路线......

我通常为Comment特定模型ID的路由保留该命名约定（GET）...理想情况下，这将全部位于名为App.CommentNewRoute的路由上。但是，是的，无论对你有用。

以下是您可能采取的一种方式：

App.CommentRoute = Ember.Route.extend({
  model: function() {
    if(Ember.isEmpty(this.modelFor('comment'))){
      return this.store.createRecord('comment');
    } else {
      return this.modelFor('comment');
    }
  }
  actions: {
    create: function(comment) {
      comment.save();
      this.set('model', this.store.createRecord('comment'));
    }
  }
});

感觉有点笨拙，但这应该会让你跟上你现在的做法。您基本上是在检查模型是否存在。如果是这样，您只需返回该模型，因为它可能已更改。

创建评论时，它会保存并使用新记录重置模型。

祝你好运！

Answer 2

每当我有某种'形式'路线（新的，编辑等）时，我使用以下命名约定：App.CommentsNewRoute和App.CommentEditRoute。这使您能够分离路径名称并在控制器上具有属性，以显示和隐藏各种输入，具体取决于用户是在编辑还是创建某些内容。

至于路线......

新路线（评论/新）：

App.CommentsNewRoute = Em.Route.extend({

  actions: {
    willTransition: function(transition) {
      var model = this.get('controller.content');

      if (model.get('isDirty')) {
        model.deleteRecord();
      }
    }
  },

  model: function() {
    return this.store.createRecord('comment');
  },

});

修改路线（评论/：comment_id /编辑）：

App.CommentEditRoute = Em.Route.extend({

  actions: {
    willTransition: function(transition) {
      var model = this.get('controller.content');

      if (model.get('isDirty')) {
        model.rollback();
      }
    }
  },

});

<强>路由器：

App.Router.map(function() {
  this.resource('comments', function() {
    this.route('new');

    this.resource('comment', { path: '/:comment_id' }, function() {
      this.route('show', { path: '/' });
      this.route('edit');
    });
  });
});

每个控制器和表单视图都有一个mixin，用于处理提交，取消，销毁，验证和服务器错误事件，还有一些计算属性（例如editing: true，new: false）。

Answer 3

我发现在willtransition方法或控制器操作方法中保存（或创建或删除）模型存在问题：保存是异步的，我们无法通过ember自然地管理异步（错误和加载状态）。所以imho，这种操作应该通过boforeModel / model / afterModel挂钩。我建议：

App.CommentsNewRoute = Em.Route.extend({
    actions: {
        clickSaveButton: function(transition) {
            var model = this.controller.get('model');
            if (model.get('isDirty') && !model.get('isEmpty')) {
                this.refresh(); // to call model hook
            }
        }
    },

    model: function() {
        if(this.controller){
            var model = this.controller.get('model');
            if(model && model.get('isDirty')){
                return this.model.save();// return promise as it shold be
            }
        }

        return this.store.createRecord('comment');
    },
});

类似于删除和编辑记录

“新”路线的灰烬图案

3 个答案: