使用Angular ngf-select上傳名稱中包含特殊字符的文件

Question

我正在使用後端彈簧引導的Angular2應用程序。在應用程序中有功能上傳文件在服務器上。上傳文件的代碼工作正常。

我正在使用ngf-select來選擇文件。當文件名不含特殊字符時，它運行良好。

<input type="file" name="file" ng-model="obj.fileModel" ngf-select accept="file_extension"> 

的問題時，我選擇具有類似於我的名字尼拉姆shrma @@特殊字符的文件出現！ %%% GGG％以.json

上傳js代碼是：

var formData = new FormData(); 
formData.append("fileObj", obj.fileModel); 
UploadFile.save(formData, onUploadSuccess, onUploadError); 

由於文件obj.fileModel具有特殊字符名稱的文件對象，因此它不叫資源的方法來上傳文件

另外我試圖通過更新文件名與編碼，但作爲文件對象是隻讀的，所以不會允許我更改名稱，也創建具有編碼文件名的新文件對象，但沒有工作。

資源的方法：

public boolean uploadMyFile(MultipartFile mpfile) throws IOException { 
... 
.... 
File file = new File(myFolder + File.separator + file.getOriginalFilename());    
mpfile.transferTo(file); 
...... 
...... 
} 

因此，有特殊字符不叫我的資源的方法的文件：uploadMyFile（..）和投擲500服務器錯誤。

如何解決使用angularJs ngf-select上傳具有特殊字符的文件的問題？

Answer 1

添加過濾器，如下

.filter('decodeURL', function() { 
    return function (text) { 
     if (text) { 
      return window.encodeURIComponent(text); 
     } 
    } 
}); 

及以下HTML

<img src="{{itemDetails.LargeImageName | decodeURL}}" />