1

I am using Angular 6.0.3 and am trying to use a progress handler when uploading a file to an ipfs daemon. The file is being uploaded correctly, but the variables that I use in my handler are not updating outside of the handler() function. Both of these functions are contained within a single component.

I assume this is some tricky typescript/javascript scope problem, but I can't seem to figure it out. Anybody got any pointers?

//we have a global variable that we use to check if we have started uploaded
isUploading = false;

This is the uploadFile function

uploadFile() {

  //We load data into a buffer
  const buf = new Buffer("string");

  //Then we write the buffer to the ipfs daemon
  this.ipfs.files.add(buf, {progress:this.handler})
    .then((result) => {
      console.log("Result isUploading = " + this.isUploading);
    })
    .catch((err) => {
      console.log(err)
    });
}

This is the handler function

handler (p) {
  this.isUploading = true;
  console.log("Handler isUploading = " this.isUploading);
}

Explicitly, the isUploading value will be true in the handler() function and false in the uploadFile() function!

Tom O'Brien
  • 1,741
  • 9
  • 45
  • 73
  • `this.isUploading` is not the same as referencing a global `isUploading`. Maybe this causes the confusion? Edit: Or is `isUploading` a field of your component? Then it is not a global variable. In this case it might be helpful to post your whole component. – Sebastian S Sep 09 '18 at 14:07
  • 1
    Try defining `handler` as an arrow function: `handler = (p) => { ... }`. – ConnorsFan Sep 09 '18 at 14:22
  • 1
    Or using bind() `{progress:this.handler.bind(this)}` – Amit Chigadani Sep 09 '18 at 14:24

0 Answers0