심화 가이드
i18n

ID로 지역 참조하기

Angular는 유니코드 지역 식별자(유니코드 지역 ID)를 사용해 텍스트 문자열의 국제화에 필요한 지역 데이터를 찾습니다.

유니코드 지역 ID

지역 ID는 언어와 국가를 지정하며, 추가 변형이나 세부 구분을 위한 코드를 선택적으로 포함합니다. 지역 ID는 언어 식별자, 하이픈(-), 지역 확장자로 구성됩니다.

{language_id}-{locale_extension}

도움말: Angular 프로젝트를 정확하게 번역하려면 국제화 대상으로 삼을 언어와 지역을 정해야 합니다.

여러 국가에서 같은 언어를 사용하더라도 사용 방식은 다를 수 있습니다. 문법, 구두점, 통화·소수·날짜의 형식 등이 다릅니다.

이 가이드의 예제에서는 다음 언어와 지역을 사용합니다.

언어 지역 유니코드 지역 ID
영어 캐나다 en-CA
영어 미국 en-US
프랑스어 캐나다 fr-CA
프랑스어 프랑스 fr-FR

Angular 저장소에는 일반적으로 사용하는 지역이 포함되어 있습니다.

언어 코드 목록은 ISO 639-2를 참고하세요.

원본 지역 ID 설정하기

Angular CLI로 컴포넌트 템플릿과 코드를 작성하는 원본 언어를 설정하세요.

Angular는 기본적으로 프로젝트의 원본 지역으로 en-US를 사용합니다.

빌드에 사용할 프로젝트의 원본 지역을 변경하려면 다음 단계를 진행하세요.

  1. angular.json 작업 공간 빌드 설정 파일을 엽니다.
  2. i18n 섹션 안의 sourceLocale 필드를 추가하거나 수정합니다.
{
  "projects": {
    "your-project": {
      "i18n": {
        "sourceLocale": "ca" // 사용할 지역 코드를 지정합니다.
      }
    }
  }
}

의존성 주입 밖에서 현재 지역 읽기

컴포넌트나 서비스 안에서는 LOCALE_ID 토큰을 주입해서 현재 지역을 가져오세요.

주입 컨텍스트 밖의 일반 함수처럼 LOCALE_ID를 주입할 수 없는 경우에는 $localize.locale을 읽으세요. 지역별 빌드마다 이 값이 설정되며, 기본 LOCALE_ID 팩토리도 이 값을 읽습니다. 애플리케이션에서 자체 LOCALE_ID를 제공하더라도 $localize.locale에는 반영되지 않습니다.

declare const $localize: {locale?: string};

export const locale = (typeof $localize !== 'undefined' && $localize.locale) || 'en-US';

이 코드는 import나 export가 있는 파일에 작성하세요. 프로젝트에 이미 @angular/localize 타입이 포함되어 있다면 declare 줄은 생략하세요.

다음 단계