translation angular i18n

angular.json

{
  ...
      "architect": {
        "build": {
          ...
          "configurations": {
            "production-fr": {
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.prod.ts"
                }
              ],
              "optimization": true,
              "outputHashing": "all",
              "sourceMap": false,
              "extractCss": true,
              "namedChunks": false,
              "aot": true,
              "extractLicenses": true,
              "vendorChunk": false,
              "buildOptimizer": true,
              "outputPath": "dist/my-project-fr/",
              "i18nFile": "src/locale/messages.fr.xlf",
              "i18nFormat": "xlf",
              "i18nLocale": "fr",
              "i18nMissingTranslation": "error"
            },
            "production-it": {
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.prod.ts"
                }
              ],
              "optimization": true,
              "outputHashing": "all",
              "sourceMap": false,
              "extractCss": true,
              "namedChunks": false,
              "aot": true,
              "extractLicenses": true,
              "vendorChunk": false,
              "buildOptimizer": true,
              "outputPath": "dist/my-project-it/",
              "i18nFile": "src/locale/messages.it.xlf",
              "i18nFormat": "xlf",
              "i18nLocale": "it",
              "i18nMissingTranslation": "error"
            },
            "fr": {
              "aot": true,
              "outputPath": "dist/my-project-fr/",
              "i18nFile": "src/locale/messages.fr.xlf",
              "i18nFormat": "xlf",
              "i18nLocale": "fr",
              "i18nMissingTranslation": "error"
            },
            "it": {
              "aot": true,
              "outputPath": "dist/my-project-it/",
              "i18nFile": "src/locale/messages.it.xlf",
              "i18nFormat": "xlf",
              "i18nLocale": "fr",
              "i18nMissingTranslation": "error"
            },
            "production": {
              ...
            }
          }
        },
        "serve": {
          ...
          "configurations": {
            "fr": {
              "browserTarget": "translations-prj:build:fr"
            },
            "it": {
              "browserTarget": "translations-prj:build:it"
            },
            ...
          }
        },
        ...
        },
        "lint": {
          ...
        }
      }
    },
    ...
}

how to add angular.json

how to add angular.json

im running this but locale is still en-US

ng serve --configuration=fr

  constructor(public appService: AppService, @Inject(LOCALE_ID) public locale: string) {
  }
  ngOnInit() {

    console.log('AppComponent.locale: ', this.locale);

AppComponent.locale: en-US