Angular: プロジェクト全体で利用する情報

Question

Angular で、プロジェクト全体で利用する情報はどこで設定するのでしょうか？

例えば、会社名を "capsule INC." と設定して、
サイトに含まれる各コンポーネントから参照したい場合どうすればいいえしょうか？

ご助言、よろしくお願いします。

Answer 1

例です。

まず下記のようなTSファイルを用意します。

// コンポーネントでそのまま使えるよう、interfaceにて型として定義
export interface AppConstInterface {
  readonly COMPANY_NAME: string;
  // 他にも定数定義
}

// コンポーネントでもそのまま使えるよう、変数として定義
export const AppConst: AppConstInterface = {
  COMPANY_NAME: 'capsule INC.',
  // 他にも定義
}

コンポーネントで使うには、下記です。

import { AppConst, AppConstInterface } from '上記ファイルへの相対パス';

// 他必要な手続きなどは省略

export class AppComponent implements OnInit {
  public AppConst: AppConstInterface = AppConst;
  
  constructor(){
    // 後は、コンポーネントのHTML内で使用することが可能
  }
}

Comments

[t-cool]

ありがとうございました！
うまく実装できました！

Answer 2

Angularに限りませんが、
プロジェクト全体で利用するデータやら変数やらを専用の一つのクラスの中で定義してしまって、各コンポーネントからそのクラスを参照するような形でやったりしますね