如何讀取angular模塊內的json配置文件？

我正在使用typescript編寫javascript，AngularJS應用程序。另外我正在使用grunt來建設。事實上，我已經開始與ng boilerplate。如何讀取angular模塊內的json配置文件？

現在假設我有一個config.json文件類似如下─

{ 
    "app": "abc", 
    "login": "xyz" 
}

我想在我的應用程序一些變量來進行配置。因此，在一些地方，我可以使用類似 -

var loginUrl : string = "def?pqr="+config.app;

現在我該怎麼讀這個配置在我的JavaScript文件？我正在尋找最佳實踐答案。我很好，在grunt build也可以替代。

注意：配置文件存在於客戶端本身，即不需要單獨從服務器加載它。

來源

2014-09-23 Vinayak Garg

在我的情況，我使用咕嚕注入的角度恆定模塊中的配置文件（與服務器共享）：

使用grunt-preprocess：

我具有帶config.tpl.js：

angular.module('app.config', []) 

.constant('appConfig', { 

    // clientside specific constants 
    var1      : 'value1', 
    var2      : [1,2,3], 
    sharedVars     : /* @echo SHARED_VARS */ 
});

然後，在我的gruntFile：

preprocess: { 
    options: { 
     context: { 
      SHARED_VARS: grunt.file.read('config.json'), 
     } 
    }, 
    config: { 
     src: 'src/config.tpl.js', 
     dest: 'src/config.js' // true file generated and loaded in index.html 
    } 
},

臨屋你可以在角度常量模塊中注入一個完整的配置文件，或者只選擇你想要的變量。

來源

2014-09-23 07:53:58

我不需要sharedVars，所以我只是使用客戶端特定的常量。這意味着我不必使用＆安裝grunt-preprocess – 2014-09-25 09:59:03

不錯，這個解決方案按預期工作。不過，我遇到了'sharedVars：/ * @echo SHARED_VARS * /'錯誤。這很明顯，因爲這是一條評論。你知道是否有辦法避免檢測到錯誤？ – C0ZEN 2016-12-01 10:15:49

@ C0ZEN包含echo的文件只是一個模板文件，你不應該按原樣使用它。這是您應該使用的生成文件src/config.js。 – 2016-12-02 13:24:46

對於客戶端代碼，您應該只使用$http.get從服務器獲取json文件。假設JSON文件是在HTTP訪問/manage/config.json你會做：

$http.get('/manage/config.json').then((res)=>{ 
    var config = res.data; 
});

$ HTTP自動完成JSON解析爲您服務。

來源

2014-09-23 06:37:03 basarat

配置文件存在於客戶本身。我將澄清這個問題。 – 2014-09-23 06:41:08

這裏是我做過什麼

var initInjector = angular.injector(['ng']); 
    var $http = initInjector.get('$http'); 
    var configModule = angular.module('portalConfig', []); 
    $http.get('../config/Settings.json').then(
      function (response) { 

       configModule.value('config', response.data); 
      } 
     );

，然後假設您的應用程序模塊是富則

angular.module('foo',['portalConfig'])

來源

2014-10-06 09:03:10

如何讀取angular模塊內的json配置文件？

回答

相關問題