Question

我正在使用Angular5。我正在显示将多个文件上传到数组的结果，并使用ngFor在UI上显示结果。

浏览所选文件以进行上传。对于每个文件，它将调用一个函数 uploadFiles（）
在该函数中，用于保存文件的服务被调用，它将通过调用函数 addFileUploadResult（）保存结果。
在用户界面中，值未显示。

我检查了组件功能，它显示数组中有项目。但是它并没有反映用户界面。

请参考下面的代码。

file-upload-component.ts

public startOperation() {
    for (let i = 0; i < this.uploadFileList.length; i++) {
        this.uploadFiles(this.uploadFileList[i], this.uploadFileList[i].name);
    }
}

uploadFiles(file: File, fileName: FileName) {
    let fileUpload: FormData = new FormData();
    fileUpload.append("file", file);
    this.fileUploadService.uploadFile(fileUpload).subscribe(result => {
        this.addFileUploadResult(fileName + " : " + this.translate.instant(result.message).toString());
    }, error => {
        this.addFileUploadResult(fileName + "Error");
    });
}

addFileUploadResult(message: string) {
    this.uploadResult.push(message);
    if (this.uploadResult.length === this.uploadFileList.length) {
        this.showUploadError = true;
    }
}

file-upload-component.html

<div style="margin: 0px 90px">
    <ul *ngIf="show" style="font-weight: bold">
           <li *ngFor="let message of uploadResult" [ngClass]="message1.includes('Success') ? 'success' : 'failed'">{{message}}</li>
   </ul>
</div>

UI未在IE中更新，使用ngFor显示数组

0 个答案: