如何启动一个JSON配置文件的角2模块，而无需使用http.get方法

我有根一个JSON文件：如何启动一个JSON配置文件的角2模块，而无需使用http.get方法

config.json

{ "base_url": "http://localhost:3000" }

，并在我的服务类，我想以这种方式来使用它：

private productsUrl = config.base_url + 'products';

我发现吨的职位与要求http.get请求加载一个文件来获得，要么解决方案的一个变量或角过时的解决方案。 js（角1）

我不相信没有一个更简单的方法来包括我们已经有了这个文件，而无需向服务器发出额外的请求。

在我看来，我本来预计至少引导功能将能够提供这种功能，是这样的：

platformBrowserDynamic().bootstrapModule(AppModule, { config: config.json });

顺便说一句，这工作，但它不是理想的解决方案：

export class Config { 
    static base_url: string = "http://localhost:3004/"; 
}

，并使用它在你需要它：

private productsUrl = Config.base_url + 'products';

它并不理想，因为我将不得不在构建脚本中创建类（或替换属性）。（正是我想要做的config.json文件）。

我仍然更喜欢config.json文件的方法，因为它不会侵入TypeScript编译器。任何想法如何做是值得欢迎的，真的很感激！

来源

2017-07-16 WilliamX

你可以看看Angular CLI如何管理'.environment.ts'文件，这是解决这个问题的方法之一 - https://github.com/angular/angular-cli/wiki/build#build-targets -and-environment-files – jonrsharpe

该链接仅指构建过程，我需要应用程序运行时的变量。我已经有了我需要用于构建的环境变量，主要问题是将这些变量注入到应用程序中。 – WilliamX

在这种情况下，它将很大程度上取决于您如何部署应用程序，而您尚未提及该应用程序。为了将一些特定于env的状态转换为静态部署的Angular应用程序，我们使用了服务器端包含，但目前尚不清楚这是否是您的选择。 – jonrsharpe

你使用的是webpack吗？如果你是，你可以做

const config = require('./config.json'); 

@Injectable() 
export class MyService { 
    private config:any = config; 
    .... 
}

在你的WebPack的配置，你需要的JSON装载机

... 
    module: { 
    ... 
    loaders: [ 
     ... 
     { 
     test: /\.json$/, 
     loaders: ["json-loader"] 
     }, 
     ... 
    ] 
    } 
    ...

来源

2017-07-16 16:51:42 eotoole

即时通讯使用System.js，但如果这与webpack的工作，我想我知道如何适应它System.js。让我检查一下它是否有效，是的，这很可能是我正在寻找的。顺便说一句，它会代表任何直接解释json文件的风险吗？我只是好奇，为什么这种支持不会开箱即用。 – WilliamX

你所描述的是相当开放的....一个xhr到一些json文件。 Angular对你的js是不可知的。 jonrsharpe提供了“开箱即用”的答案。如果上面的方法并不适用于systemjs，并且你确实需要一个独立的XHR请求，则考虑：如此，而不是 doRunYourBootstrapCode（）你可以做 doLoadYourJsonWithHttpGet（），然后（JSON =>。 {jrnd}; }）; 我会尝试加载它通过systemjs和无论你用于“打包”第一，因为它是一个少打电话。祝你好运。 – eotoole

真棒@eotoole，这正是我正在寻找的。如果我将Angular理解为一个“包含”的JavaScript块/函数集合，那么您需要指示模块加载器如何加载json是合理的。添加System.js版本作为附加答案。 – WilliamX

This link explains how to use System.js to load json files in an angular app.

特别感谢@eotoole是指出我在正确的方向。

如果上面的链接不够清楚，只需在System.js conf中添加一个映射即可。像这样：

map: { 'plugin-json': 'https://unpkg.com/systemjs-plugin-json' } *

*（使用外部包）

或

map: { 'plugin-json': 'plugin-json/json.js' } **

**如果从下载插件：

official system.js plugin

现在我可以使用：

const config = require('./config.json');

anywere在我的应用程序。

由于它是官方的“systemjs” - 伙计们，我很乐意使用它来加载像base_url或其他端点的应用程序设置。

现在我需要弄清楚如何封装这个逻辑用于测试目的。可能需要在自己的类中使用该文件并替换特定测试用例的值。

来源

2017-07-17 16:42:11 WilliamX

如何启动一个JSON配置文件的角2模块，而无需使用http.get方法

回答

相关问题