我正在使用一個子組件:
<app-photo-editor [addPhotoUrlExtension]="'users/add-photo'" [onUploadSuccess]="onUploadPhotoSuccess"
[deletePhoto]="onDeletePhoto"></app-photo-editor>
并將其傳遞給 onUploadPhotoSuccess 函式:
onUploadPhotoSuccess(response: any) {
if (response) {
const photo = JSON.parse(response);
this.member.photoUrl = photo.url; // offending line
...
在子組件上,我接受該函式,并呼叫父函式:
export class PhotoEditorComponent implements OnInit {
@Input() onUploadSuccess: (response: any) => void;
...
this.uploader.onSuccessItem = (item, response, status, headers) => {
if (response) {
this.onUploadSuccess(response);
}
}
這在違規行(上面標記)上給出了一個錯誤,說:
core.js:6498 ERROR TypeError: Cannot set properties of undefined (setting 'photoUrl')
at PhotoEditorComponent.onUploadPhotoSuccess [as onUploadSuccess] (member-edit.component.ts:67:27)
at FileUploader.uploader.onSuccessItem (photo-editor.component.ts:60:14)
at FileUploader._onSuccessItem (ng2-file-upload.js:1326:1)
at XMLHttpRequest.xhr.onload [as __zone_symbol__ON_PROPERTYload] (ng2-file-upload.js:1073:29)
at XMLHttpRequest.wrapFn (zone.js:763:1)
at ZoneDelegate.invokeTask (zone.js:406:1)
at Object.onInvokeTask (core.js:28679:1)
at ZoneDelegate.invokeTask (zone.js:405:1)
at Zone.runTask (zone.js:178:1)
at ZoneTask.invokeTask [as invoke] (zone.js:487:1)
這意味著this.member未定義,現在一方面它確實有意義我需要將它傳遞給子組件,但另一方面,我認為這按原樣作業..所以我不確定什么是正確的解決方案..
uj5u.com熱心網友回復:
這是因為您將常規函式傳遞給另一個組件,因此this關鍵字不是指原始組件。
您應該使用箭頭函式onUploadPhotoSuccess或系結this到它。
onUploadPhotoSuccess = (response: any) => {
轉載請註明出處,本文鏈接:https://www.uj5u.com/caozuo/409766.html
標籤:
下一篇:在js中轉換物件
