Javascript 如何读取json文件？

我想读json文件。 但是，当a读取我的常量时，它是空的。。 非常感谢你的帮助

import { HttpClientModule, HttpClient } from '@angular/common/http';

@NgModule({
    imports: [
        HttpClientModule
    ]
})

   private url: string= './../../json/config.json';
   constructor(private http: HttpClient) {}

   const aaa = this.http.get(this.url);
   console.log('aaa', aaa)

   console.log === Observable {_isScalar: false, source: Observable, operator: MapOperator}
   operator: MapOperator {project: ƒ, thisArg: undefined}
   source: Observable {_isScalar: false, source: Observable, operator: FilterOperator}
   _isScalar: false
   __proto__: Object

<pre>{{newData | json}}</pre>

---

我以前在angular项目中使用过json文件。主要在等级库文件中，但下面是一个示例。您可以使用json文件相对于代码文件的路径导入（或要求）json文件

import * as testData from './testing/probe.testdata.json';

然后使用

testData

变量使用json数据。像这样：

const obj = (<any>testData);
var myJsonProp = obj.PropertyName;

export class State {
    constructor(public id: number, public name: string) { }
}
export class City {
    constructor(public id: number, public name: string, public state) { }
}

export const states: State[] = [
    {
        id: 0,
        name: 'Alabama'
    },
    {
        id: 1,
        name: 'Alaska'
    }
...

const obj=（testData）；
var myJsonProp=obj.PropertyName；

---

这适用于我，请注意，例如，这是在typescript中。但是js也能工作。这将取代您对

this.http.get（this.url）

的调用祝您好运

我使用这样的类：

const obj = (<any>testData);
var myJsonProp = obj.PropertyName;

export class State {
    constructor(public id: number, public name: string) { }
}
export class City {
    constructor(public id: number, public name: string, public state) { }
}

export const states: State[] = [
    {
        id: 0,
        name: 'Alabama'
    },
    {
        id: 1,
        name: 'Alaska'
    }
...

然后在组件中：

import { State, states, City, cities } from '../../shared/classes/us-areas';
...
readonly states: State[] = states;
readonly cities: City[] = cities;

然后我可以使用该类：

console.log(this.user.cities);
console.log(this.user.states);

对于JSON，您可以简单地导入文件或订阅其端点源，并使用Angular的JSON管道输出它

---

您需要在Observable上调用

subscribe

，您想做什么？“阅读”是什么意思？为什么要使用http模块读取本地json？@borisdery，帮我读取本地json；）他试图将json文件读入变量/对象，以便使用数据。他之所以使用http，是因为他认为这就是你的做法。那当然不行，所以他在问一个问题。这对我来说是个公平的问题。我添加了一个答案@Romain。祝你好运。我尝试了一下，但我有一个错误模块解析失败：在“{picto:true}”@Romain附近解析时，JSON中的意外标记p位于位置4，这意味着你的JSON文件格式不正确。同意@cale_b制作一个非常简单的JSON文件来测试你的消费代码。然后，您可以修复真实json文件中的任何问题。只需谷歌搜索json验证器，您就会找到json.FWIW的在线验证器。json解析错误意味着我的答案有效，您正在使用json代码。正如我们所说，这是无效的