Angular 类型“Observable”上不存在属性“map”
我想使用以下代码实现文件下载: Rest API:Angular 类型“Observable”上不存在属性“map”,angular,typescript,angular6,angular7,Angular,Typescript,Angular6,Angular7,我想使用以下代码实现文件下载: Rest API: @GetMapping("export") public ResponseEntity<InputStreamResource> export() throws IOException { ClassPathResource pdfFile = new ClassPathResource(EXTERNAL_FILE_PATH); HttpHeaders headers = new HttpH
@GetMapping("export")
public ResponseEntity<InputStreamResource> export() throws IOException {
ClassPathResource pdfFile = new ClassPathResource(EXTERNAL_FILE_PATH);
HttpHeaders headers = new HttpHeaders();
headers.add("Cache-Control", "no-cache, no-store, must-revalidate");
headers.add("Pragma", "no-cache");
headers.add("Expires", "0");
return ResponseEntity.ok().headers(headers).contentLength(pdfFile.contentLength())
.contentType(MediaType.parseMediaType("application/pdf"))
.body(new InputStreamResource(pdfFile.getInputStream()));
}
组成部分:
import {Component, OnInit} from '@angular/core';
import {DownloadService} from "../service/download.service";
import {ActivatedRoute, Router} from "@angular/router";
import {flatMap} from "rxjs/internal/operators";
import {of} from "rxjs/index";
import { map } from 'rxjs/operators';
@Component({
selector: 'app-download',
templateUrl: './download.component.html',
styleUrls: ['./download.component.scss']
})
export class DownloadComponent implements OnInit {
constructor(private downloadService: DownloadService,
private router: Router,
private route: ActivatedRoute) {
}
ngOnInit() {
}
export() {
this.downloadService.downloadPDF().subscribe(res => {
const fileURL = URL.createObjectURL(res);
window.open(fileURL, '_blank');
});
}
}
启动angular时,我得到错误:src/app/panel/service/download.service.ts17,91中的错误:错误TS2339:类型“Observable”上不存在属性“map”
将地图导入代码的正确wya是什么?
当我点击下载按钮时,什么都不会发生。您可能正在使用Rxjs 5.5或更高版本 在Rxjs 5.5之后,您不能再直接将map之类的操作符链接到可观察值上。您必须使用.pipe,然后传递逗号分隔的运算符列表
import { map } from 'rxjs/operators';
...
downloadPDF(): any {
return this.http.get(environment.api.urls.downloads.getPdf, {
responseType: 'blob',
observe: 'response'
})
.pipe(
map((res: any) => {
return new Blob([res.blob()], { type: 'application/pdf' });
})
);
}
这是给你的裁判的一封信
顺便说一句,这是一个检查Rxjs语法到目前为止如何变化的神奇工具。您可能正在使用Rxjs 5.5或更高版本 在Rxjs 5.5之后,您不能再直接将map之类的操作符链接到可观察值上。您必须使用.pipe,然后传递逗号分隔的运算符列表
import { map } from 'rxjs/operators';
...
downloadPDF(): any {
return this.http.get(environment.api.urls.downloads.getPdf, {
responseType: 'blob',
observe: 'response'
})
.pipe(
map((res: any) => {
return new Blob([res.blob()], { type: 'application/pdf' });
})
);
}
这是给你的裁判的一封信
顺便说一句,这是一个检查Rxjs语法到目前为止如何变化的神奇工具。您可以这样调用请求,因为您使用的是angular 6
downloadPDF(): any {
return this.http.get(environment.api.urls.downloads.getPdf, { responseType: 'blob' });
}
更新:
导入响应内容类型
从'@angular/Http'导入{Http,ResponseContentType}
您可以这样调用请求,因为您使用的是angular 6
downloadPDF(): any {
return this.http.get(environment.api.urls.downloads.getPdf, { responseType: 'blob' });
}
更新:
导入响应内容类型
从'@angular/Http'导入{Http,ResponseContentType}
谢谢现在我在src/app/panel/service/download.service.ts21,30中得到错误:错误TS2339:属性“blob”在类型“blob”上不存在。@PeterPenzov,将其类型指定为any。这会解决的,谢谢。现在我在src/app/panel/service/download.service.ts21,30中得到错误:错误TS2339:属性“blob”在类型“blob”上不存在。@PeterPenzov,将其类型指定为any。我在src/app/panel/service/download.service.ts19,81:错误TS2304:找不到名称'ResponseContentType'。我在src/app/panel/service/download.service.ts21,65:错误TS2345:类型{responseType:ResponseContentType;}的参数不能分配给类型{headers?:HttpHeaders{[标题:字符串]:字符串|字符串[];};observe?:body;params?:Ht…'。属性'responseType'的类型不兼容。类型'ResponseContentType'不可分配给类型'json'。请立即检查我在src/app/panel/service/download.service.ts19,81:错误TS2304:找不到名称'ResponseContentType'。我在src/app/panel/service/download.service.ts21,65:错误ror TS2345:类型{responseType:ResponseContentType;}的参数不能分配给类型{headers?:HttpHeaders{[header:string]:string | string[];};observe?:body;params?:Ht…。属性“responseType”的类型不兼容。类型“ResponseContentType”不能分配给类型“json”。请立即检查