下载Angular 4中的图像

下载Angular 4中的图像,angular,angular4-forms,Angular,Angular4 Forms,我正在尝试从angular 4中的UI下载图像。到目前为止,我已应用以下代码下载该图像: DownloadImageFromUrl(imageUrl) { imageUrl = this.ImagePath + imageUrl; this.Service.GetImage(imageUrl, { responseType: ResponseContentType.Blob }) .map(res => { return new Blob([res._body], {

我正在尝试从angular 4中的UI下载图像。到目前为止,我已应用以下代码下载该图像:

DownloadImageFromUrl(imageUrl) {
imageUrl = this.ImagePath + imageUrl;
this.Service.GetImage(imageUrl, { responseType: ResponseContentType.Blob })

  .map(res => {
    return new Blob([res._body], {
      type: res.headers.get("Content-Type")
    });
  })
  .map(blob => {
    var urlCreator = window.URL;
    return 
    this.sanitizer.bypassSecurityTrustUrl(urlCreator.createObjectURL(blob));
  })
 } 
在GetImage函数之后:

GetImage(url: string, options?: RequestOptionsArgs): Observable<any> {
    return this._http.get(url, this.addWithImage(options)).map((res) => res.json());
}

private addWithImage(options?: RequestOptionsArgs): RequestOptionsArgs {
    // ensure request options and headers are not null
    options = options || new RequestOptions();
    options.headers = options.headers || new Headers();

    // add authorization header with token
    const token = 'XXXXXXXX';
    if (token) {
        options.headers.append('Authorization', 'Bearer ' + token);
        options.headers.append('Content-Type', 'image/jpg');
    }
    return options;
}

请告诉我这段代码出了什么问题?

我不确定它是否能工作,现在无法测试它,但请尝试一下:

DownloadImageFromUrl(imageUrl) {
 imageUrl = this.ImagePath + imageUrl;
 var link = document.createElement("a");
 link.setAttribute("href", imageUrl);
 link.setAttribute("download", 'coolNameForTheFile.jpg');
 link.innerText = "click";
 link.click();
}

先用Chrome试试。我在Firefox中遇到了问题。

谢谢您的回答。它正在同一窗口中打开文件。我不想打开它。