Emberjs - 如何在保存后重置组件上的字段？

Question

我在游戏中有一个名为 Comment 的嵌入式对象。每个游戏可以有很多评论。

当用户（称为家长）查看游戏页面时，他们可以发表评论。

我遇到的问题是，我似乎无法在评论保存后将评论字段的正文重置为空。

这是组件：

MyApp.AddCommentComponent = Ember.Component.extend({

  body: '',
  actions: {
    addComment: function() {

      var comment, failure, success;
      if (!!this.get('body').trim()) {
        comment = this.store.createRecord('comment', {
          body: this.get('body'),
          game: this.get('game'),
          parent_id: this.get('parent_id'),
          parent_name: this.get('parent_name')
        });

        success = (function() {
          this.set('body', '');
        });
        failure = (function() {
          return console.log("Failed to save comment");
        });
        return comment.save().then(success, failure);
      }
    }
  }
});

错误在 'this.set' 行 - this.set 不是函数

我找到的所有示例都是关于在控制器中执行此操作或通过在路由更改时创建新记录（但在我的示例中路由没有更改，因为它只是将另一个嵌入对象添加到现有页面） .

Answer 1

当您引入 function 时，您必须记住 this 的值（不一定）与 this 的封闭范围的值相同。保存对 Component 的引用以在闭包中使用，如下所示：

MyApp.AddCommentComponent = Ember.Component.extend({

  body: '',
  actions: {
    addComment: function() {

      var comment, failure, success;
      var self= this;

      if (!!this.get('body').trim()) {
        comment = this.store.createRecord('comment', {
          body: this.get('body'),
          game: this.get('game'),
          parent_id: this.get('parent_id'),
          parent_name: this.get('parent_name')
        });

        success = (function() {
          self.set('body', '');
        });
        failure = (function() {
          return console.log("Failed to save comment");
        });
        return comment.save().then(success, failure);
      }
    }
  }
});

Answer 2

您正在使用

this.set('body', '');

成功，但是这里的范围发生了变化，你需要保持控制器范围并将正文设置为空字符串，如

MyApp.AddCommentComponent = Ember.Component.extend({

  body: '',
  actions: {
    addComment: function() {
      var that = this;
      var comment, failure, success;
      if (!!this.get('body').trim()) {
        comment = this.store.createRecord('comment', {
          body: this.get('body'),
          game: this.get('game'),
          parent_id: this.get('parent_id'),
          parent_name: this.get('parent_name')
        });

        success = (function() {
          that.set('body', '');
        });
        failure = (function() {
          return console.log("Failed to save comment");
        });
        return comment.save().then(success, failure);
      }
    }
  }
});

Emberjs - 如何在保存后重置组件上的字段？

Emberjs - how to reset a field on a component after saving?

ember.js

ember-data

ember-components