Angular 6: 在应用程序中从本地加载 csv

Angular 6: Loading csv from local in application

我正在尝试加载我保存在资产文件夹中的 csv 文件。无论我做什么,它总是抛出错误。但是,如果我尝试手动获取此文件 (http://localhost:4201/assets/states.csv),我可以做到这一点。

ngOnInit() {
    this.http
      .get("/assets/states.csv")
      .pipe(
        map((res: any) => res.json())
      )
      .subscribe(data => {
        console.log(data);
      });
  }

错误:

core.js:1673 ERROR HttpErrorResponse {headers: HttpHeaders, status: 200, statusText: "OK", url: "http://localhost:4201/assets/states.csv", ok: false, …}

它甚至显示状态 200,但我想知道它处于错误模式。

使用{responseType: 'text'}

ngOnInit() {
   this.http
      .get("/assets/states.csv", {responseType: 'text'})
      .pipe(
         map((res: any) => res.json())
      )
      .subscribe(data => {
         console.log(data);
      });
}

您需要通知 Angular 您希望得到 text 的响应。

如果您使用的是新的 HttpClientModule,那么您必须将 responseType 设置为 'text',否则 HttpClient 会尝试将内容解释为 json 并引发 SyntaxError...

this.http.get('assets/file.csv', {responseType: 'text'})
    .subscribe(
        data => {
            console.log(data);
        },
        error => {
            console.log(error);
        }
    );