在Angular 4中保存全局设置的位置

15 浏览
0 Comments

在Angular 4中保存全局设置的位置

在Angular(TypeScript)中有许多配置文件。哪个是保存全局设置的正确文件?\n例如,当我从本地调用API时,我的rootUrllocalhost:42000,但当我切换到生产环境时,它应该是http:www.someting.com。\n我想将这个rootUrl保存在某个全局位置,这样如果我切换到生产环境,我只需要在这个rootUrl上进行更改。\n请建议我应该在哪里保存这些全局设置,就像在Asp.Net中的web.config文件一样。

0
0 Comments

在Angular 4中,我们需要找到一个合适的地方来保存全局设置,以便在生产模式下更容易找到常量来更改值。为了解决这个问题,我有另一种定义全局设置的方法。

首先,我创建了一个名为SettingService的服务。在这个服务中,我定义了一个名为getJSON的方法,它用于获取设置文件的内容。然后,我在getSetting方法中使用这些设置。

然后,在app文件夹中,我添加了一个名为configs的文件夹,并在其中创建了一个名为setting.json的文件。在setting.json文件中,我定义了一个名为baseUrl的全局设置。

接下来,在app模块中,我添加了一个名为APP_INITIALIZER的提供器。在这个提供器中,我使用了SettingService,并调用了它的getSetting方法来获取设置。通过这种方式,我可以更轻松地在json文件中更改值。

我在项目中应用了这种方法来保存baseUrl、dateformat和sessiontimeout等全局设置。通过这种方式,我们可以更方便地修改这些值,而不需要修改ts文件。

在Angular 4中,我们需要找到一个合适的地方来保存全局设置,以便在生产模式下更容易找到常量来更改值。为了解决这个问题,我们可以创建一个SettingService服务来保存全局设置。在这个服务中,我们定义了一个getJSON方法来获取设置文件的内容,并在getSetting方法中使用这些设置。

然后,我们可以在app文件夹中创建一个configs文件夹,并在其中创建一个setting.json文件来保存全局设置。在setting.json文件中,我们可以定义各种全局设置,如baseUrl、dateformat和sessiontimeout等。

接下来,在app模块中,我们可以通过添加一个名为APP_INITIALIZER的提供器来获取并应用这些全局设置。在这个提供器中,我们可以使用SettingService,并调用它的getSetting方法来获取设置。通过这种方式,我们可以更方便地在json文件中更改这些全局设置的值。

通过使用这种方法,我们可以更轻松地在Angular 4项目中保存和修改全局设置,而不需要修改ts文件。这样可以使我们的代码更加清晰和易于维护。

0
0 Comments

在开始使用Angular 2的时候,我使用了一个global.ts文件,将所有的变量放在里面,这样我就可以轻松地进行更改。

然后,我发现了Angular CLI提供的环境变量功能。你只需要创建一个名为environment.prod.ts的文件(用于生产环境),并在构建时使用ng build --prod命令。在开发过程中,使用environment.ts文件,并且这两个文件必须具有相同的变量。

希望这个回答能解决你的问题。

0
0 Comments

在Angular 4中保存全局设置的问题是因为需要在不同环境下使用不同的设置,比如开发环境和生产环境。解决方法是在不同的环境中创建相应的配置文件,并在代码中引用正确的配置文件。

首先,在开发和测试环境中,可以在environment.ts文件中定义全局设置,如下所示:

export const environment = {
  production: false,
  appUrl: 'localhost:4200'
};

然后,在生产环境中,可以在environment.prod.ts文件中定义全局设置,如下所示:

export const environment = {
  production: true,
  appUrl: 'mywebsite.com'
};

在代码中使用这些全局设置时,可以通过引用相应的配置文件来获取设置的值,如下所示:

import { environment } from '../../environments/environment';
this._http.get(environment.appUrl, requestHeaders(options));

需要注意的是,在所有的环境配置文件中都要设置production参数。

另外,如果需要在其他环境下使用不同的配置文件,比如单元测试环境,也可以创建相应的配置文件,如environment.unittesting.ts。

在切换到生产环境时,不需要在每个服务文件中更改引用的配置文件。Webpack会自动识别生产环境和非生产环境的文件。

如果使用Angular CLI,只需要运行ng build命令即可。这个命令会根据配置文件自动构建项目。

如果想要了解更多细节,可以参考tattoocoder.com/angular-cli-using-the-environment-option

不需要多次构建项目,也没有其他更改根API URL的方法。

0