2017-08-23 80 views
0

上傳文件我選擇像這樣在模板的文件:文件陣列中具有角4

<input type="file" #fileupload [(ngModel)]="myFile" name="myFile" (change)="fileChange(fileupload.files)" /> 

然後在組件使用該功能來操縱對象:

fileChange(event){ 
console.log(event); 
this.myFile = event[0];} 

編譯爲OK,並且沒有錯誤,但我得到這個錯誤在瀏覽器中:

ERROR Error: [object Object] 
at viewWrappedDebugError (core.es5.js:8410) 
at callWithDebugContext (core.es5.js:13475) 
at Object.debugHandleEvent [as handleEvent] (core.es5.js:13053) 
at dispatchEvent (core.es5.js:8602) 
at core.es5.js:9213 
at HTMLInputElement.<anonymous> (platform-browser.es5.js:2651) 
at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:424) 
at Object.onInvokeTask (core.es5.js:3881) 
at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:423) 
at Zone.webpackJsonp.../../../../zone.js/dist/zone.js.Zone.runTask (zone.js:191) 

而且

ERROR Error: Uncaught (in promise): InvalidStateError: Failed to set the 'value' property on 'HTMLInputElement': This input element accepts a filename, which may only be programmatically set to the empty string. 
Error: Failed to set the 'value' property on 'HTMLInputElement': This input element accepts a filename, which may only be programmatically set to the empty string. 

事實上,我可以看到對象包含我選擇的文件,但仍然出現錯誤。

enter image description here

回答

1

你不能用JavaScript出於安全考慮更改文件上傳輸入的值。沒有plunkr或任何東西很難說,但我認爲你的錯誤發生在這裏:this.myFile = event[0];快速檢查你是設置一個臨時變量,而不是this.myFile。

編輯: 您需要刪除ngModel,並將fileChange的參數更改爲「event」而不是fileupload.files。那麼這應該工作。

+0

「改變文件上傳輸入的值」是什麼意思?我只是嘗試使用價值。你能解釋更多嗎? – Al007

+0

檢查我的編輯,但出於安全原因解釋檢查在這裏:https://stackoverflow.com/questions/1696877/how-to-set-a-value-to-a-file-input-in-html – dockleryxk