CODEWITHSUNDEEP
javascriptember.js
Mohamad Zein
Mohamad Zein

Reputation: 777

How to preform a component action rather than a route action in ember-file-upload

I am using the package https://github.com/tim-evans/ember-file-upload

In their example, they call a route action to upload an image

             onfileadd=(route-action "uploadImage")}}

However I would like to instead call a component action

I tried doing 

                 onfileadd="uploadImage"}}

and added the action in component: 

uploadImage: function (file) {
  console.log(file);
  let self = this;
  RSVP.cast(Ember.$.get(ENV.APP.API_HOST + "/v1/teams/signed_url/")).then(function (response) {
    return file.upload(response.url, {
      data: response.credentials
    });
  }).then(function (response) {
    self.set('url', response.headers.Location);
  });
},

But I got the error:

Uncaught TypeError: Cannot read property 'uploadImage' of undefined

The action works as expected if I move it to route, but I need to update the correct properties in the component (that do not exist in the route)

Any idea what I can do to change that to a component function ?

Upvotes: 1

Views: 91

Answers (1)

nem035
nem035

Reputation: 35491

You should use the action helper:

onfileadd=(action "uploadImage")}}

Also make sure that uploadImage is within the actions hash in your component:

export default Ember.Component.extend({
  // ...
  actions: {
    uploadImage() { // <-- make sure this is inside the actions hash
      // ...
    }
  }
})

Upvotes: 1

Related Questions