Angular：如何读取位于 assets 文件夹中的文本文件？

Question

我正在尝试打开一个在我的资产文件夹中的 .txt 文件。名称为"Maze1.txt"。我对这些东西有点陌生，所以我想知道是否有人可以帮助我读取该文件的文本内容。非常感谢。如果需要更多信息，请告诉我。 :)

- ISHAAN PATEL

Answer 1

你可以使用 HttpClient 进行此操作（将其作为 httpClient 导入并注入）。

this.httpClient.get('assets/Maze1.txt', {responseType: 'text'})
        .subscribe(data => console.log(data));

- Timon

---

我尝试过了，但是即使声明了http，我仍然不断收到这个错误：无法读取未定义的“get”属性。 - ISHAAN PATEL

你是否在你的模块中导入了'@angular/common/http'中的HttpClientModule，并且在你的服务/组件中从'@angular/common/http'中导入了HttpClient？请参阅文档：https://angular.io/guide/http - Eliseo

这是我在我的应用程序模块中添加的内容：import { HttpClientModule } from '@angular/common/http'; 我还将其放入了导入数组中。对于我的组件，我在顶部添加了以下内容：import { HttpClient } from '@angular/common/http'; 但它仍然无法工作。 - ISHAAN PATEL

我还添加了 import { Observable, throwError } from 'rxjs'; 和 import { catchError, retry } from 'rxjs/operators'; - ISHAAN PATEL

Answer 2

算了，我找到了一个可行的解决方案，使用构造函数。对于任何正在寻找可行代码的人，请使用以下代码：

private httpClient: HttpClient;

  constructor(http: HttpClient) {
    this.httpClient = http;
  }

在这个函数中，我使用了以下内容：

this.httpClient.get('assets/Maze1.txt', { responseType: 'text' })
      .subscribe(data => console.log(data));

- ISHAAN PATEL

---

Timon的回答暗示您在构造函数中注入了HttpClient，因此最好直接要求他编辑他的答案。 另外，更好的注入HttpClient的方法是删除您声明的httpClient变量，即删除private httpClient: HttpClient;这一行，并将构造函数更改为constructor(private httpClient: HttpClient) {}。 - David Alberici