Angular 2: Unable to bind to 'uploader' since this is not a known property of 'input'

I am trying to integrate the ng2-file-upload module into my application.

And I get this template error: Unable to bind to the “loader”, since this is not a known “input” property

UPDATE str folder:

/src/app/app.module.ts

/src/app/components/layout/
                           layout.module.ts
                           other layout components files

                  /category-items
                            category-items.module.ts
                            category-items.component.ts

in layout.module.ts

import { LayoutComponent } from './layout.component';

declarations: [
    LayoutComponent,

in the category items.module.ts

import { CategoryItemsComponent } from './category-items.component';

import {FileUploadModule} from "ng2-file-upload";   

imports: [  ...FileUploadModule ... ]   

application \ app.module.ts

 import {FileUploadModule} from "ng2-file-upload";   

 imports: [  ...FileUploadModule ... ]  

Application \ Components \ location \ item-category \ category-items.component.ts

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

@Component({
  selector: 'button-view',
  template: '

  <input type="file" class="form-control" name="single" ng2FileSelect [uploader]="uploader" />   

  '
  })

export class ButtonViewComponent implements ViewCell, OnInit {

...
 public uploader:FileUploader = new FileUploader({url:'http://lcoalhost:5000/upload'});

}

@Component({
  selector: 'app-category-items',
  templateUrl: './category-items.component.html',
  styleUrls: ['./category-items.component.scss']
})

export class CategoryItemsComponent implements OnInit {
...
}

Or, if I try, as shown below: I get an unexpected closing div tag

<div ng2FileDrop
         (fileOver)-'fileOverBase($event)'
         [uploader]="uploader"
         class="well my-drop-zone">
        Base drop zone
    </div>

I tried several import combinations for 'FileUploadModule' in my app.module in different publications, but none of them work in my case.

Error Stack Trace:

"Uncaught ( ): : : an '', 'input'. (" ↵ ↵

:

: ( )

https://github.com/valor-software/ng2-file-upload/issues/418

https://github.com/valor-software/ng2-file-upload/issues/608

+10
2

FileUploadModule , 'upload', category-items.module.ts

-items.module.ts

import { CategoryItemsComponent } from './category-items.component';

import { FileUploadModule } from "ng2-file-upload";   //Should import HERE

imports: [  ...FileUploadModule ... ]   //RIGHT PLACE
+26

app.module.ts

import { FileSelectDirective } from 'ng2-file-upload';
@NgModule({
    imports: [
        ...
],
    declarations: [
        FileSelectDirective
    ],
    providers: [
        ...
],
    bootstrap: [
        App,
    ],
})

https://github.com/valor-software/ng2-file-upload/issues/418#issuecomment-249865170

FIleUploadModule

{FIleUploadModule} 'ng2-file-upload';

imports: [
    FIleUploadModule,
    ..........,
    ........,
    ......,

]

.

0

Source: https://habr.com/ru/post/1682217/


All Articles