Wie kann ich den Wert der Komponente im Controller aktualisieren oder mit der Glut routen?

Question

Meine click-editable Komponente wie:

Vorlage:

{{#if isEdit}} 
    <div class="input-group"> 
    {{input type="text" value=editValue class="form-control"}} 
    <div class="input-group-btn"> 
     <button type="button" class="btn no-margin-btn btn-info" {{action "updateValue"}}>{{fa-icon 'check'}}</button> 
    </div> 
    </div> 
{{else}} 
    .... 
{{/if}} 

Und:

export default Ember.Component.extend({ 
    tagName: "", 
    isEdit: false, 
    canEdit: true, 
    category: 'input', 
    editValue: Ember.computed.oneWay('value'), 

    actions:{ 
    updateValue() { 
     this.sendAction('onUpdate', this.get('valueModel'), this.get('valueColumn'), this.get('editValue'), this.get('isEdit')); 
    } 
    } 
}); 

Verwendung in meiner Vorlage:

{{#each model.quotationWorkItems as |quotationWorkItem index|}} 
    {{click-editable valueModel=quotationWorkItem valueColumn='name' value=quotationWorkItem.name onUpdate=(action "updateInput")}} 
{{/each}} 

In der Steuerung:

import Ember from 'ember'; 

export default Ember.Controller.extend({ 
    .... 

    actions: { 
    updateInput(updateModel, updateColumn, value, isEdit) { 
     updateModel.set(updateColumn, value); 
     updateModel.save().then(()=> { 
     this.get('model').reload(); 
     this.set('isEdit', false); 
     },()=> { 
     alert('wrong'); 
     }); 
    } 
    } 
}) 

Route:

import Ember from 'ember'; 

export default Ember.Route.extend({ 
    ... 

    model(params) { 
    return this.store.find('quotation', params.quotation_id); 
    }, 

    setupController(controller, model) { 
    controller.set('model', model); 
    ... 
    } 
}) 

Quotation Modell:

import DS from 'ember-data'; 

export default DS.Model.extend({ 
    quotationStocks: DS.hasMany('quotationStock'), 
    quotationWorkItems: DS.hasMany('quotationWorkItem'), 
    ... 
}); 

QuotationWorkItem Modell:

import DS from 'ember-data'; 

export default DS.Model.extend({ 
    transactionType: DS.belongsTo('transactionType'), 
    quotation: DS.belongsTo('quotation'), 

    ... 
}); 

Dieser Code kann Modellwert aktualisieren, aber Problem isEdit ist der Komponentenwert. Wenn isEdit an Controller senden und einen anderen Wert festlegen, kann es nicht funktionieren. Also ich denke, kann Komponent Wert im Glut-Controller nicht ändern?

this.set('isEdit', false); 

Der Code kann nicht im Controller funktionieren. Ich benutze Ember 2.4.0.

Answer 1

Sie müssen die isEdit-Eigenschaft controller an die Komponente isEdit-Eigenschaft binden.

{{click-editable isEdit=isEdit valueModel=quotationWorkItem valueColumn='name' value=quotationWorkItem.name onUpdate=(action "updateInput")}} 

Dies wird die isEdit Eigenschaft in der Komponente (Daten unten) überschreiben.