Remove Queued Item After Confirm Dialog #1110

New Issue

2019-09-13T04:21:31Z

frankkreutzer commented

2019-09-13 04:21:31 +00:00

(Migrated from github.com)

I want the functionality that when a user clicks the remove button for a queued file, a JS confirmation dialog pops up where the user must click "Ok" for the file to actually be removed for the queue. I know in my code I'm passing the index of the first file in the queue, I'm not sure how to get the index of the current file that was clicked to be removed.

Code:

import { FileUploader, FileItem } from 'ng2-file-upload';


const URL = 'https://evening-anchorage-3159.herokuapp.com/api/';

@Component({
  selector: 'app-document-upload',
  templateUrl: './document-upload.component.html',
  styleUrls: ['./document-upload.component.scss']
})
export class DocumentUploadComponent implements OnInit {
  public uploader: FileUploader = new FileUploader({ url: URL });


  constructor() {
    
  }

  ngOnInit() {
    document.getElementById("headerText").innerHTML = "Section 3: Scope Documents Upload";
  }

  confirmDelete() {
    var confirmDialog = confirm("Are you sure you want to remove this file?");
    if (confirmDialog == true) {
      this.uploader.removeFromQueue(this.uploader.queue[0]);
    } 
  }
}

I want the functionality that when a user clicks the remove button for a queued file, a JS confirmation dialog pops up where the user must click "Ok" for the file to actually be removed for the queue. I know in my code I'm passing the index of the first file in the queue, I'm not sure how to get the index of the current file that was clicked to be removed. Code: ```import { Component, OnInit } from '@angular/core'; import { FileUploader, FileItem } from 'ng2-file-upload'; const URL = 'https://evening-anchorage-3159.herokuapp.com/api/'; @Component({ selector: 'app-document-upload', templateUrl: './document-upload.component.html', styleUrls: ['./document-upload.component.scss'] }) export class DocumentUploadComponent implements OnInit { public uploader: FileUploader = new FileUploader({ url: URL }); constructor() { } ngOnInit() { document.getElementById("headerText").innerHTML = "Section 3: Scope Documents Upload"; } confirmDelete() { var confirmDialog = confirm("Are you sure you want to remove this file?"); if (confirmDialog == true) { this.uploader.removeFromQueue(this.uploader.queue[0]); } } } ```

deshack commented

2019-12-01 18:20:19 +00:00

(Migrated from github.com)

Hi,
You should get the loop index in the *ngFor directive and pass it to your confirmDelete() callback.

Hi, You should get the loop index in the `*ngFor` directive and pass it to your `confirmDelete()` callback.

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: dc/ng2-file-upload#1110