2017-02-02 15 views
2

thisライブラリを使用して、angle2 CR5タイスクリプトのファイルをアップロードしようとしています。コンポーネントのHTML側の一部である'uploader'は 'div'の既知のプロパティではないため、バインドできません

import { Component } from '@angular/core'; 
import { FileUploader } from 'ng2-file-upload'; 

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

@Component({ 
    selector: 'app-simple-demo', 
    templateUrl: './simple-demo.component.html', 
    styleUrls: ['./simple-demo.component.css'] 
}) 
export class SimpleDemoComponent { 
    public uploader:FileUploader = new FileUploader({url: URL}); 
    public hasBaseDropZoneOver:boolean = false; 
    public hasAnotherDropZoneOver:boolean = false; 

    public fileOverBase(e:any):void { 
    this.hasBaseDropZoneOver = e; 
    } 

    public fileOverAnother(e:any):void { 
    this.hasAnotherDropZoneOver = e; 
    } 
} 

  <div ng2FileDrop 
       [ngClass]="{'nv-file-over': hasBaseDropZoneOver}" 
       (fileOver)="fileOverBase($event)" 
       [uploader]="uploader" 
       class="well my-drop-zone"> 
       Base drop zone 
      </div> 

私は私が持っているコンポーネントに最初のi

、そう
npm i ng2-file-upload --save 

を角度"version": "1.0.0-beta.16"

を使用していますそれに文句を言う:

Can't bind to 'uploader' since it isn't a known property of 'div'. ("s': hasAnotherDropZoneOver}" 
       (fileOver)="fileOverAnother($event)" 
       [ERROR ->][uploader]="uploader" 
       class="well my-drop-zone"> 
       Another drop zone 
"): [email protected]:17 
+0

問題なく動作していますか?はいの場合は、ソリューションを共有できますか? –

答えて

5

解決策は、最新のバージョンに私の角度を更新することでした。次いで

app.moduleファイルに次の行を追加します

import { FileUploadModule } from "ng2-file-upload"; 
//... 
@NgModule({ 
    imports: [ 
     //..., 
     FileUploadModule 
    ], 
    declarations: [], 
    providers: [] 
}) 
export class ObjektinfoModule { 
} 
+0

どの角度バージョンを使用していますか? –

0

溶液がメインモジュールにFIleUploadModuleをインポートするだけです。

import { FileUploadModule } from 'ng2-file-upload' 
... 
imports: [ 
... 
FileUploadModule 
], 
0

場合によっては、大括弧[uploader]の代わりに(uploader)を使用してプロパティを正しくバインドする必要があります。非常に奇妙ですが、私の問題を解決しました。

関連する問題