Input file repository dropped.
See below how to upload a file.

ngx-input-file is a module to replace the html element input file and also allows you to upload files.
Style is based on Bootstrap File Input.

• Preview of the file
• Drag and drop zone
• Responsive
• Bootstrap 4 required.
• Font Awesome 5 support

npm install ngx-input-file --save

import { NgModule } from '@angular/core';
import { InputFileModule } from 'ngx-input-file';


@NgModule({
    imports: [
        ... 
        InputFileModule,
        ...
    ],
    ...
})

export class MyModule {}

Import InputFileModule in your module.

The type is the mime type of the file.
The extension is a shortly example of the file extension. To add an other type, please open a issue.

<input-file 
    inputId="images" 
    inputAccept=".docx,.pdf,image/*"
    [disableUpload]="true"
    inputMaxFiles="4" 
    [(model)]="inputFileModel"
    [textBrowse]="Rechercher"
    [textFileSelected]="'COMMON.FORM.FILES.SELECTED' | translate"
    [textNoFile]="'COMMON.FORM.FILES.NO' | translate"
    [textRemove]="'COMMON.REMOVE' | translate"
    (acceptedFile)="onAccept($event)"
    (removedFile)="onRemoveImage($event)">
</input-file> 

Here's an example to post a file:

import { HttpClient } from '@angular/common/http';

@Injectable()
export class MyRepository {

constructor(
    private http: HttpClient
) {}

public post(file: any): Observable<any> {
    const apiUrl = 'my-url';
    const formData = new FormData();
    formData.append('file', file.file, file.file.name);
    return this.http.post(apiUrl, formData)
        .map(res => <any>res);
}

Icons is not packaged with the module.
Default path of file icons is assets/img with the extension .png.
Any help is welcome to package icons or configure the path and extension. You can pick icons free here.

You're welcome, please fork this repository to a make pull request.

Clone this repository and run npm start.

• Drop font awesome 4 support to font awesome 5

• Fix issue #3