Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>angular i18n key injectorNew to Visual Studio Code? Get it now.
angular i18n key injector

angular i18n key injector

Drunken Wizard

|
87 installs
| (0) | Free
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Angular i18n Translation Key Generator

Overview

Enhance your Angular application's internationalization process with this Visual Studio Code extension that automatically generates i18n translation keys for HTML and TypeScript files.

Usage

  • HTML: Go to your HTMl file, press F1, type createi18nhtml, and hit Enter.
  • TypeScript: Select a string or multiple string (e.g. alt + mouse selection) in a TypeScript file, press F1, type createi18nts, and hit Enter.

Examples

HTML

Before:

<input placeholder="Enter your name">
<p>Welcome to our site!</p>

After:

<input placeholder="Enter your name" i18n-placeholder="@@ANGULAR_FILENAME_ENTERYOURNAME">
<p i18n="@@ANGULAR_FILENAME_WELCOMETOOURSITE">Welcome to our site!</p>

TypeScript

Before:

const greeting = "Welcome to our site!";
const greeting = "`Welcome to our site ${hello}!`";

After:

const greeting = $localize`:@@ANGULAR_FILENAME_WELCOMETOOURSITE:Welcome to our site!`;
$localize`:@@ANGULAR_FILENAME_WELCOMETOOURSITE:Welcome to our site ${hello}!`;

Support

For questions or updates, visit our GitHub repository.

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft