I am developing a web application using Angular 6. This is my folder structure. app | pages | dashboard | maps
In maps component I am uploading files using 'ng2-file-upload'. This is my 'maps.component.html'
<form #mapsForm="ngForm" enctype="multipart/form-data">
<div class="form-group">
<label for="name">Name</label>
<div class="input-group">
<input id="mapName" class="form-control" name="mapName" >
</div>
<br>
<label for="geoRefMap">Geo- reference Map</label>
<div class="input-group">
<input type="file" #fileInput name="milespec"
class="form-control"
ng2FileSelect
[uploader]="uploader"
(change)="handleFileInput($event.target.files)" />
<img src="../../../../../assets/images/maps/Browse.png" width="40" height="40" style=" position: absolute; top: 1px; right: 1px" onclick="openfileDialog();"/>
</div>
<br>
</form>
I used 'FileUploader' in maps.component.ts file.
import { FileUploader, FileSelectDirective } from 'ng2-file-upload';
export class MapsComponent implements OnInit {
public uploader:FileUploader = new FileUploader({url: URL});
}
But it gives me the following error.
Uncaught (in promise): Error: Template parse errors: Can't bind to 'uploader' since it isn't a known property of 'input'. (" class="form-control" ng2FileSelect [ERROR ->][uploader]="uploader" (change)="handleFileInput($event.target.files)" /> <!-- <in"): ng:///DashboardModule/MapsComponent.html@23:9 Error: Template parse errors:
I tried several solutions here 'https://github.com/valor-software/ng2-file-upload/issues/418' But did not work. I tried adding 'FileSelectDirective' into all the parents modules time to time. But did not work. Does any one has any solution?
