在 httmclient 方法 Angular 中读取 json 文件答案

【问题标题】：Read json file in httmclient method Angular在 httmclient 方法 Angular 中读取 json 文件
【发布时间】：2019-06-22 23:53:30
【问题描述】：

我有一个小问题，我想在我的 html 页面中显示数据，我在这个服务中使用了一个服务我使用 httpclient 像这样：http.get("./users.json") 但它不起作用，我有一个错误，我该如何解决这个错误，Thnaks fo 回答 :)

enter image description here

user.service.ts

getUsers() : Observable<User[]> {
    return this.http.get("./users.json").pipe(map(data=>{
        let usersList = data["userList"];
        return usersList.map(function(user:any) {
            return {name: user.userName, age: user.userAge};
        });
    }));
}

user.component.ts

users: User[] = [];
constructor(private userService: UserService){}
ngOnInit(){
   this.userService.getUsers().subscribe(data => this.users=data);
}

user.component.html

<li *ngFor="let user of users">
   <p>Name: {{user?.name}}</p>
   <p>Age: {{user?.age}}</p>
</li>

【问题讨论】：

如果你真的需要 http 请求获取该文件，你需要将 json 文件添加到角度资产中，但我建议使用 import data from 'some.config' 或者通过依赖注入更好

标签： angular observable httpclient

【解决方案1】：

这是关于链接的：将您的文件放在资产文件夹下并尝试以下代码：

return this.http.get<any>('assets/users.json')

【讨论】：