AngularでAzure App Configurationにあるキーを参照してみる

前回⇒AngularでAzure App Configurationの機能フラグを使ってみた
機能フラグは取得することができたが、格納したアプリケーション設定を参照できるか試してみた。

環境

Angular v12

必要なパッケージ

"@azure/app-configuration": "^1.3.0"
"@azure/identity": "^1.5.0"

準備

App Configurationで参照するキーを用意

「構成エクスプローラー」→「作成」でキーを作成する

コード

App Configurationに接続するclientを作成

  const conn = '接続文字列'; 
  const client = new AppConfigurationClient(conn);

キーの参照

  applicationSettingConfig = ''; // 参照したキー値を格納する変数

  const val = await client.getConfigurationSetting({ key: '参照したいキー' });
  console.log(val); // ←どんな値がとれてるか確認してみよう
  this.applicationSettingConfig = val.value === undefined ? '' : val.value;

結果

applicationSettingConfigを表示して👇のようにキーの値が表示できた。
（前回の機能フラグのコーディングも残してるのでそこは無視してください）

ソース