---
title: "Angular translation & i18n tutorials"
description: "Translate your Angular app step by step — with ngx-translate, Transloco or Angular's built-in i18n using XLIFF files."
canonical: "https://www.codeandweb.com/tutorials/angular"
source: "html"
---

# Angular translation & i18n tutorials

Translate your Angular app step by step — with ngx-translate, Transloco or Angular's built-in i18n using XLIFF files.  
We currently have these 11 tutorials [tagged](https://www.codeandweb.com/tags.md) with **angular**:

![Angular Localization with ngx-translate: Complete Tutorial](https://www.codeandweb.com/static/3d259f82fbc214c0061ca60d12df938b/d8f52/how-to-translate-your-angular-app-with-ngx-translate.png)

[Angular Localization with ngx-translate: Complete Tutorial](https://www.codeandweb.com/babeledit/tutorials/how-to-translate-your-angular-app-with-ngx-translate.md)

Master Angular i18n with ngx-translate. Complete tutorial covering setup, translation files, language switching, and best practices. Includes working examples.

![How to Translate Your Angular App with NGX-Translate (Angular 16)](https://www.codeandweb.com/static/3d259f82fbc214c0061ca60d12df938b/d8f52/how-to-translate-your-angular-app-with-ngx-translate.png)

[How to Translate Your Angular App with NGX-Translate (Angular 16)](https://www.codeandweb.com/babeledit/tutorials/how-to-translate-your-angular-app-with-ngx-translate-16)

Free tutorial: Set up Angular with ngx-translate, switch language at runtime, extract translations, edit translation files. Covers Angular 16

![How to translate your Angular 8 - 16 app with ngx-translate](https://www.codeandweb.com/static/3d259f82fbc214c0061ca60d12df938b/d8f52/how-to-translate-your-angular-app-with-ngx-translate.png)

[How to translate your Angular 8 - 16 app with ngx-translate](https://www.codeandweb.com/babeledit/tutorials/how-to-translate-your-angular8-16-app-with-ngx-translate)

Free tutorial: Set up Angular with ngx-translate, extract translations from code, switch translations at runtime, edit translation files. Covers Angular 8-16

![How to translate your Angular app with Transloco](https://www.codeandweb.com/static/4021a619f2e5a603cb720942b4a92cd8/d8f52/how-to-translate-your-angular-app-with-transloco.png)

[How to translate your Angular app with Transloco](https://www.codeandweb.com/babeledit/tutorials/how-to-translate-your-angular-app-with-transloco.md)

Free tutorial: Set up Angular with Transloco (@jsverse/transloco), extract translations from code, switch translations at runtime, edit translation files.

![How to translate your Angular app with Transloco (@ngneat/transloco)](https://www.codeandweb.com/static/4021a619f2e5a603cb720942b4a92cd8/d8f52/how-to-translate-your-angular-app-with-transloco.png)

[How to translate your Angular app with Transloco (@ngneat/transloco)](https://www.codeandweb.com/babeledit/tutorials/how-to-translate-your-angular-app-with-transloco-ngneat)

Free tutorial: Set up Angular with Transloco, extract translations from code, switch translations at runtime, edit translation files.

![How to translate Angular apps: @angular/localize and XLIFF](https://www.codeandweb.com/static/7c6e7735fb996c4d4ed6f22b63a80c04/d8f52/how-to-translate-your-angular-app-with-xlf-files.png)

[How to translate Angular apps: @angular/localize and XLIFF](https://www.codeandweb.com/babeledit/tutorials/how-to-translate-your-angular-app-with-xlf-files.md)

Free tutorial: Learn how to use @angular/localize to translate your Angular app with xliff (xlf) files. Covers ICU syntax. Example source code included.

![How to install Angular on Windows](https://www.codeandweb.com/static/29cb8e7b60abf6e855b705675085cb1a/a3fa1/how-to-install-angular-on-windows.png)

[How to install Angular on Windows](https://www.codeandweb.com/babeledit/tutorials/how-to-install-angular-on-windows.md)

Short tutorial (Video: 2min) and a step to step guide on how to install Node.js and Angular on a Windows computer. Create your first Angular project.

![How to translate Angular 14 apps: @angular/localize and xlf](https://www.codeandweb.com/static/7c6e7735fb996c4d4ed6f22b63a80c04/d8f52/how-to-translate-your-angular-app-with-xlf-files.png)

[How to translate Angular 14 apps: @angular/localize and xlf](https://www.codeandweb.com/babeledit/tutorials/how-to-translate-your-angular14-app-with-xlf-files)

Free tutorial: Learn how to use @angular/localize to translate your Angular 14 app with xliff (xlf) files. Covers ICU syntax. Example source code included.

![How to translate Angular 9 apps: @angular/localize and xlf](https://www.codeandweb.com/static/3d259f82fbc214c0061ca60d12df938b/d8f52/how-to-translate-your-angular-app-with-ngx-translate.png)

[How to translate Angular 9 apps: @angular/localize and xlf](https://www.codeandweb.com/babeledit/tutorials/how-to-translate-your-angular9-app-with-xlf-files)

Free tutorial: Learn how to use @angular/localize to translate your Angular 9 app with xliff (xlf) files. Covers ICU syntax. Example source code included.

![How to translate your Angular 7 app with ngx-translate](https://www.codeandweb.com/static/3d259f82fbc214c0061ca60d12df938b/d8f52/how-to-translate-your-angular-app-with-ngx-translate.png)

[How to translate your Angular 7 app with ngx-translate](https://www.codeandweb.com/babeledit/tutorials/how-to-translate-your-angular7-app-with-ngx-translate)

Free tutorial: Set up Angular 7 with ngx-translate, extract translations from code, switch translations at runtime, edit translation files.

![How to translate your Angular 6 app with ngx-translate](https://www.codeandweb.com/static/3d259f82fbc214c0061ca60d12df938b/d8f52/how-to-translate-your-angular-app-with-ngx-translate.png)

[How to translate your Angular 6 app with ngx-translate](https://www.codeandweb.com/babeledit/tutorials/how-to-translate-your-angular6-app-with-ngx-translate)

You learn: How to set up ngx-translate, automatically keep your translation files up to date with ngx-translate-extract and edit multiple JSON files at once.