Emberjs - Wie setze ich ein Feld auf einer Komponente nach dem Speichern zurück?

Question

Ich habe ein eingebettetes Objekt namens Comment, in einem Spiel. Jedes Spiel kann viele Kommentare enthalten.

Wenn ein Benutzer (Parent) die Spielseite aufruft, kann er einen Kommentar hinterlassen.

Das Problem, das ich habe, ist, dass ich nicht scheinen kann, den Körper des Kommentarfeldes zurück zu leeren, nachdem der Kommentar gespeichert wird.

Dies ist die Komponente:

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); 
     } 
    } 
    } 
}); 

Der Fehler ist auf der ‚this.set‘ line - this.set Alle

ist die Beispiele nicht eine Funktion, die ich finden über das tun dies in einem Controller oder durch Erstellen eines neuen Datensatzes bei einer Routenänderung (aber die Route ändert sich in meinem Beispiel nicht, da nur ein weiteres eingebettetes Objekt zur bestehenden Seite hinzugefügt wird).

Answer 1

Sie verwenden

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

in Erfolg, aber der Umfang dieser hier geändert wird, müssen Sie den Controller halten Umfang und setzen den Körper zu leeren String wie

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); 
     } 
    } 
    } 
}); 

Answer 2

Wenn Sie eine function einführen, müssen Sie daran denken, dass der Wert für this ist nicht (unbedingt) das gleiche wie das umschließende Wert Umfang des für this. Speichern Sie den Verweis auf die Component in einem Verschluss zu verwenden, wie folgt aus:

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); 
     } 
    } 
    } 
});