Pass variable from callback function in component to template


#1

I’ve uploaded a file with ember-cli-dropzone (https://www.npmjs.com/package/ember-cli-dropzonejs). This works fine. Now i need to update my template with the filename.

Inside a component I have the filename in a callback function. But now i need to pass this to the routes setupController function. So i can use the controller.set, as shown below.

The component JS:

export default Ember.Component.extend({
  actions: {
   submit: function(){
     this.sendAction('action', this.submission);
   }
 },
 uploadSuccess: function(file, response) {
   if (response == '200') {
    return file.name;
   }
 }
});

setupController inside the route:

setupController: function(controller, model){
	var submission = this.store.createRecord('submission', { filter: { assignment_id: model.id } });

	submission.filename = filenamePlease; 
	controller.set('submission', submission);

}

compenent inside template:

{{submission-form submission=submission user=user action='createSubmission'}}

component HBS:

<form {{action 'submit' on='submit'}}>
  {{drop-zone url='http://localhost:4200/api/uploads' success=uploadSuccess}}
  {{input type="hidden" value=submission.filename}}
  <button class="bnt" type="submit">{{buttonLabel}}</button>
</form>

How do i get the corresponding template to update after the file has uploaded and the uploadSuccess has returned the filename?