decebal
decebal

Reputation: 1211

Angular - Use translation from outside 'assets'

I need to add my translation files outside the assets directory, something like this:

src/app/custom/i18n/en.json

I am loading the translations like this:

export function createTranslateLoader(http: HttpClient) {
    return new TranslateHttpLoader(http, './app/custom/i18n/', '.json');
}

But this doesn't work as it doesn't find the file:

GET http://localhost:8100/app/custom/i18n/en.json 404 (Not Found)

I tried to customize the angular.json file in order to be able to access files outside 'assets', doing something like this:

"assets": [
              {
                "glob": "**/*",
                "input": "src/assets",
                "output": "assets"
              },
              {
                "glob": "**/*",
                "input": "src/app/common",
                "output": "assets"
              }
]

but I still get that 404 error. Please advise how could I set the translation to use json files from outside assets. Thank you!

Upvotes: 0

Views: 1132

Answers (1)

Kshitij
Kshitij

Reputation: 657

You need to specify messages file in assests array. As custom/i18n/en.json is not specified in an assets array it is not going to be bundled when you build your project. Therefore giving 404 error

"assets": [
    {
        "glob": "**/*",
        "input": "src/assets",
        "output": "assets"
    },
    {
        "glob": "**/*",
        "input": "src/app/common",
        "output": "assets"
    },
   "custom/i18n/en.json"
]

Upvotes: 2

Related Questions