JavaScript / Angular 中的屬性文件

Question

在 Java 中，我通常在我的資源文件夾中創建application.properties並將配置放在那里。

當我需要它時，我只需執行Properties prop = new Properties(); prop.load(... my file) Properties prop = new Properties(); prop.load(... my file)然后使用prop.getProperty("Something")

我想在 Javascript 中做類似的事情

在我的 js 代碼中，我有這個：

// REST API Base URL
var baseUrl = "http://localhost:8083/api";

我希望它位於 application.properties 文件中，然后加載該值。

我怎樣才能做到這一點？

謝謝

Answer 1

在 Angular 2+ 項目和良好實踐中，您應該創建每個 env 一個文件的環境文件夾，例如：environment.js、environment.prod.js。

並導入文件，您可以導出常量或默認情況下

export const environment = {
  apiUrl: '',
  googleApiKey: '',
}

您可以在需要的每個文件中導入此環境，例如

import { environment } from '{relativePath}/environment/environment.js'

如果您為每個環境創建不同的文件，例如 prod。 您需要為將要構建的 env 替換 environment.js。 你有很多關於 webpack 或其他編譯器的信息。

我強烈建議你開發成一個 common.js 項目。 導入模塊會更友好，您將擁有可擴展應用程序的強大可能性。

但簡單（丑陋）的解決方案是：

索引.html

<head>
  <script src="environment.js">
  <script src="app.js">
</head>

環境.js

// Declaring environment like that you will have window scoped the variable
// and you will have global access to environment with window.environment
var environment = {apiUrl: 'https://api.url:4100'}

應用程序.js

function example(){
  console.log(window.environment.apiUrl); // out https://api.url:4100
}

Answer 2

該方法取決於您如何構建和/或捆綁 AngularJs 應用程序。 但無論如何，您都需要創建一個 config.json 文件來包含您的設置。 如果使用 browserify 或 webpack，您可以通過 require(...) 導入該文件，否則您可以在應用程序引導之前通過 ajax 簡單地請求它。

在任何這些情況下，在整個應用程序中使用配置數據的最佳方法是在引導階段將其定義為常量： app.constant('CONFIG', configData); ，假設 configData 是一個包含來自 config.json 文件的數據的變量。

然后你可以使用依賴注入為你的所有控制器、服務和指令提供 CONFIG。

JavaScript / Angular 中的屬性文件

問題描述

2 個解決方案

解決方案1
2 2018-11-09 10:03:48

解決方案2
0 2018-11-09 10:27:05

JavaScript / Angular 中的屬性文件

問題描述

2 個解決方案

解決方案1 2 2018-11-09 10:03:48

解決方案2 0 2018-11-09 10:27:05

解決方案1
2 2018-11-09 10:03:48

解決方案2
0 2018-11-09 10:27:05