如何在单独的文件中声明常量答案

【问题标题】：how to decalare constants in separate file如何在单独的文件中声明常量
【发布时间】：2019-02-05 20:18:32
【问题描述】：

我需要将以下所有这些数据声明到一个单独的常量文件中，并在 ts/controller 文件之一中使用它

this.flags = {};
    this.flags['NL'] = "flag-icon flag-icon-nl";
    this.flags['BE'] = "flag-icon flag-icon-be";
    this.flags['DE'] = "flag-icon flag-icon-de";
    this.flags['FR'] = "flag-icon flag-icon-fr";
    this.flags['SE'] = "flag-icon flag-icon-se";
    this.flags['ES'] = "flag-icon flag-icon-es";


if(this.routingConfiguratioService.countryCode==='BE'){
      this.labels["ILB"] = "Athlon Car Lease";
      this.labels["DAL"] = "Belfius Auto Lease NV";
      this.labels["C4P"] = "Cars4Publicity BVBA";
    } else if(this.routingConfiguratioService.countryCode==='LU'){
       this.labels["LUX"] = "Athlon Car Lease Lux";
    } else{
       this.labels["ACL"] = "Athlon Car Lease";
       this.labels["WPL"] = "Wagenplan";
    }

【问题讨论】：

请检查下面的答案，这将解决您的问题
This answer 可能会有所帮助

标签： angular

【解决方案1】：

您可以使用export 这样做

data.constant.ts

// You can also simplify your object like this to avoid repetitions by using String Interpolation

const flagIcon = "flag-icon flag-icon-";

export const flags = {
  "NL": `${flagIcon}nl`,
  "BE": `${flagIcon}be`,
  "DE": `${flagIcon}de`,
  "FR": `${flagIcon}fr`,
  "SE": `${flagIcon}se`,
  "ES": `${flagIcon}es`
};

组件

import { flags } from './data.constant'


@Component({...})
export class ChildComponent {

    flagList = flags;    // assign it here or you can console it on your constructor

    constructor() {
       console.log(flags);
       console.log(this.flagList);
    }

}

【讨论】：

【解决方案2】：

只需像这样创建const 类型：

export const flags = {
  'NL': "flag-icon flag-icon-nl",
  'BE': "flag-icon flag-icon-be",
  'DE': "flag-icon flag-icon-de",
  'FR': "flag-icon flag-icon-fr",
  'SE': "flag-icon flag-icon-se",
  'ES': "flag-icon flag-icon-es",
};

export const labels = {
  "ILB": "Athlon Car Lease",
  "DAL": "Belfius Auto Lease NV",
  "C4P": "Cars4Publicity BVBA",
  "LUX": "Athlon Car Lease Lux",
  "ACL": "Athlon Car Lease",
  "WPL": "Wagenplan",
}

然后将它们导入到您的组件中：

import { Component } from '@angular/core';
import { flags, labels } from './flags.const';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  name = 'Angular';

  ngOnInit() {
    console.log('flags: ', flags);
    console.log('labels: ', labels);
    /*if(this.routingConfiguratioService.countryCode==='BE'){
      this.labels["ILB"] = "Athlon Car Lease";
      this.labels["DAL"] = "Belfius Auto Lease NV";
      this.labels["C4P"] = "Cars4Publicity BVBA";
    } else if(this.routingConfiguratioService.countryCode==='LU'){
       this.labels["LUX"] = "Athlon Car Lease Lux";
    } else{
       this.labels["ACL"] = "Athlon Car Lease";
       this.labels["WPL"] = "Wagenplan";
    }*/
  }

}

这里有一个Working Sample StackBlitz 供您参考。

【讨论】：

【解决方案3】：

要声明常量值，您需要创建单独的constant.ts 文件

constant.ts

export const flags {
     static  abc:string = 'ABC'
 }

现在在组件中导入上面的文件并访问下面的值

flags.abc;

希望这会有所帮助！

【讨论】：

不需要将常量对象包装在一个类中
谢谢乔塔。托莱多