[typescript] typescript에서 클래스 상수를 구현하는 방법은 무엇입니까?

Angular 2 Opaque Constants라는 매우 멋진 기능을 제공합니다. 불투명 한 상수를 사용하여 클래스를 만들고 모든 상수를 정의하십시오.

import { OpaqueToken } from "@angular/core";

export let APP_CONFIG = new OpaqueToken("my.config");

export interface MyAppConfig {
    apiEndpoint: string;
}

export const AppConfig: MyAppConfig = {
    apiEndpoint: "http://localhost:8080/api/"
};

app.module.ts의 공급자에게 주입하십시오.

모든 구성 요소에서 사용할 수 있습니다.

Angular 4 편집 :

Angular 4의 경우 새로운 개념은 주입 토큰 및 불투명 토큰은 Angular 4에서 더 이상 사용되지 않습니다.

주입 토큰 불투명 토큰 위에 기능을 추가하고 TypeScript 제네릭과 주입 토큰을 통해 토큰에 유형 정보를 첨부 할 수 있으며 @Inject를 추가 할 필요가 없습니다.

예제 코드

불투명 토큰을 사용하는 Angular 2

const API_URL = new OpaqueToken('apiUrl'); //no Type Check


providers: [
  {
    provide: DataService,
    useFactory: (http, apiUrl) => {
      // create data service
    },
    deps: [
      Http,
      new Inject(API_URL) //notice the new Inject
    ]
  }
]

인젝션 토큰을 사용하는 Angular 4

const API_URL = new InjectionToken<string>('apiUrl'); // generic defines return value of injector


providers: [
  {
    provide: DataService,
    useFactory: (http, apiUrl) => {
      // create data service
    },
    deps: [
      Http,
      API_URL // no `new Inject()` needed!
    ]
  }
]

주입 토큰은 Opaque 토큰 위에 논리적으로 설계되었으며 Opaque 토큰은 Angular 4에서 더 이상 사용되지 않습니다.

답변

class Circle {
  readonly radius: number;

  constructor(radius: number) {
    this.radius = radius;
  }

  get area() {
    return Math.PI * this.radius * 2;
  }
}

const circle = new Circle(12);
circle.radius = 12; // Cannot assign to 'radius' because it is a read-only property.

type Rectangle = {
  readonly height: number;
  readonly width: number;
};

const square: Rectangle = { height: 1, width: 2 };
square.height = 5 // Cannot assign to 'height' because it is a read-only property

export enum MyConstants {
  MyFirstConstant = 'MyFirstConstant',
  MySecondConstant = 'MySecondConstant'
}

export class MyComponent {
public MY_CONTANTS = MyConstans;
constructor() { }
}

<div [myDirective]="MY_CONTANTS.MyFirstConstant"> </div>