0

I am migrating from Angular js to Angular 8. How can I migrate these lines of code to Angular 8:

<button class="other-button contactUsSpecific"
        type="button" data-ngf- 
        select="contactCtrl.uploadFiles($file)"
        data-ngf-max-size="9MB"
        data-ngf-model-invalid="errorFiles">
    <span [innerHTML]="tk.contactus.upload"></span> 
</button>

I cannot find data-ngf equivalent over the internet for Angular 8.

j3ff
  • 5,719
  • 8
  • 38
  • 51
  • I guess the idea here is not about simply migrate code, it's about looking for another alternative of `ngf-select` library in Angular 8, or use `FormData` module built-in that comes with Angular 8. – Mostav Apr 16 '20 at 15:01

1 Answers1

-2

You should have look at the answer:1 to get information on how to upload file using Angular 8. We can add maximum size of file constraint by modifying the function call on change at file input field.

Eg: app.component.ts

export class AppComponent  {
    files: FileList;
    fileToUpload: File = null;
    maxFileSizeBytes: number = 9e+6;
    handleFileInput(event){
    this.files = event.target.files;
    this.fileToUpload = this.files[0];
    if(this.fileToUpload.size < this.maxFileSizeBytes){
        console.log("Less than required size, file will be uploaded.");
    }else{
        console.log("Exceeding Size");
    }
}

app.component.html

<div class="form-group">
    <label for="file">Choose File</label>
    <input id="file" (change)="handleFileInput($event)" type="file">
</div>

Make service call in if else block. Attaching stackblitz for more clarity Angular File Upload Demo

Ratik
  • 29
  • 9