Angular 7-无法从资产读取JSON文件

时间:2019-09-20 17:01:50

标签: json angular typescript

我正在尝试从我在angular项目中的资产中读取JSON配置文件。我创建了一个服务,并在initializeApp函数中调用App.Module.ts。

我的jSON文件位于 src / assets / config / 文件夹中

启动时,它将在控制台中显示一个空的Json文件“ {}”。

这是我的服务。

import { IConfig } from "../_model/config";
import { Injectable } from '@angular/core';
import { environment } from 'src/environments/environment';
import { HttpClient, HttpResponse } from '@angular/common/http';
import { Observable } from 'rxjs';
import 'rxjs/add/operator/map';



@Injectable()
export class Config {
    static settings: IConfig;

    constructor(private http: HttpClient) {
    }

    load() {
        const jsonFile = `assets/config/config.${environment.name}.json`; // ${environment.name} could be 'prod' or  'dev'

        return new Promise<void>((resolve, reject) => {
            this.http.get(jsonFile).toPromise().then((response: IConfig) => {
                Config.settings = <IConfig>response;
                resolve();
            }).catch((response: any) => {
                reject(`Error en archivo de configuracion '${jsonFile}': ${JSON.stringify(response)}`);
            });
        });
    }

和配置界面(如果要检查):

export interface IConfig {
    config: {
        production: boolean;
    };
    path: {
        url_root: string;
    };
    timeZone: {
        time: number;
    };
}

控制台错误

core.js:15724 ERROR Error en archivo de configuracion 'assets/config/config.dev.json': {}

它总是用于捕获并使用EMPTY JSON打印错误消息,就像不存在一样。

如果您需要更多信息,请告诉我。

2 个答案:

答案 0 :(得分:0)

我认为您必须将"src/assets/config/"路径添加到angular.json文件的assets: []数组中。然后,我认为您必须重新编译服务器。

答案 1 :(得分:0)

您需要后退两次。 ../../

替换

const jsonFile = `assets/config/config.${environment.name}.json`; 

const jsonFile = `../../assets/config/config.${environment.name}.json`; 

安全推荐

但是,我建议您必须将配置放在 environment 文件而不是 assets 文件夹中,因为环境由浏览器保护而资产将向任何人公开。