{"id":92243,"date":"2019-05-29T07:00:46","date_gmt":"2019-05-29T04:00:46","guid":{"rendered":"http:\/\/www.javacodegeeks.com\/?p=92243"},"modified":"2019-05-27T18:13:09","modified_gmt":"2019-05-27T15:13:09","slug":"angular-internationalization-example","status":"publish","type":"post","link":"https:\/\/www.javacodegeeks.com\/2019\/05\/angular-internationalization-example.html","title":{"rendered":"Angular Internationalization Example"},"content":{"rendered":"<p>Welcome readers, in this tutorial, we will implement <strong>internationalization<\/strong> in an angular application.<\/p>\n<h2>1. Introduction<\/h2>\n<ul>\n<li><strong>Angular<\/strong> is a Typescript-based open-source framework that helps developers build single page applications<\/li>\n<li>Offers Object-oriented features and supports the dynamic loading of the pages<\/li>\n<li>Supports Two-way data-binding, Property (<code>[]<\/code>), and Event (<code>()<\/code>) binding techniques<\/li>\n<li>Supports command-line-interface to easily initiate and manage the angular projects from the command line<\/li>\n<\/ul>\n<h3>1.1 Internationalization<\/h3>\n<p>Internationalization is a concept of making an application available to a global audience in a user-friendly fashion. Angular provides the inbuilt i18n tools but they encounter their own disadvantages. For instance, JIT decreases the application performance while AOT increases the compilation time of the application. To overcome these problems, we will use a commonly used third-party library known as <code>ngx-translate<\/code>.<\/p>\n<p>Now open the visual studio code and let us see how to implement this tutorial in the angular framework.<\/p>\n<h2>2. Angular Internationalization Example<\/h2>\n<p>Here is a systematic guide for implementing this tutorial.<\/p>\n<h3>2.1 Tools Used<\/h3>\n<p>We are using Visual Studio Code and Node Terminal to compile and execute the angular code on a browser.<\/p>\n<h3>2.2 Project Structure<\/h3>\n<p>In case you are confused about where you should create the corresponding files or folder, let us review the project structure of the angular application.<\/p>\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"304\" height=\"404\" src=\"https:\/\/www.javacodegeeks.com\/wp-content\/uploads\/2019\/05\/angular-internationalization-project-structure-guide-1.jpg\" alt=\"Angular Internationalization - Application Structure\" class=\"wp-image-92245\" srcset=\"https:\/\/www.javacodegeeks.com\/wp-content\/uploads\/2019\/05\/angular-internationalization-project-structure-guide-1.jpg 304w, https:\/\/www.javacodegeeks.com\/wp-content\/uploads\/2019\/05\/angular-internationalization-project-structure-guide-1-226x300.jpg 226w\" sizes=\"(max-width: 304px) 100vw, 304px\" \/><figcaption>Fig. 1: Application Structure<\/figcaption><\/figure>\n<\/div>\n<h2>3. Creating Angular application<\/h2>\n<p>Run the <code>ng new angulari18n<\/code> command in the npm console to create a new angular project. Once the new project is created, execute the following commands in the npm console to install and load <code>ngx-translate<\/code> dependency required for this example.<\/p>\n<pre class=\"brush:html; wrap-lines:false;\">npm install @ngx-translate\/core \u2013save\n\nnpm install @ngx-translate\/http-loader\n<\/pre>\n<h3>3.1 Importing Translation Module<\/h3>\n<p>Import and inject the Http client and Translation module in the <code>src\/app\/app.module.ts<\/code> file. In this file, we will also create an Http Loader factory that returns an object which loads the translations using http and json files. Add the following code to the file.<div style=\"display:inline-block; margin: 15px 0;\"> <div id=\"adngin-JavaCodeGeeks_incontent_video-0\" style=\"display:inline-block;\"><\/div> <\/div><\/p>\n<p><span style=\"text-decoration: underline\"><em>app.module.ts<\/em><\/span><\/p>\n<pre class=\"brush:js; wrap-lines:false;\">import { BrowserModule } from '@angular\/platform-browser';\nimport { NgModule } from '@angular\/core';\n\nimport { HttpClientModule, HttpClient } from '@angular\/common\/http';\n\n\/\/ Importing internationalisation translator modules in the application.\nimport { TranslateModule, TranslateLoader } from '@ngx-translate\/core';\nimport { TranslateHttpLoader } from '@ngx-translate\/http-loader';\n\nimport { AppComponent } from '.\/app.component';\n\n\/\/ \"HttpLoaderFactory\" returns an object that loads the translations using the .json file.\n\/\/ Function returns the \"TranslateHttpLoader\" object for the AOT compiler.\nexport function HttpLoaderFactory(http: HttpClient) {\n  return new TranslateHttpLoader(http);\n}\n\n@NgModule({\n  declarations: [\n    AppComponent\n  ],\n\n  \/\/ Importing the modules into the application module.\n  imports: [\n    BrowserModule, HttpClientModule,\n    TranslateModule.forRoot({\n      loader: {\n        provide: TranslateLoader,\n        useFactory: HttpLoaderFactory,\n        deps: [HttpClient]\n      }\n    })\n  ],\n\n  providers: [],\n\n  bootstrap: [AppComponent]\n})\n\nexport class AppModule { }\n<\/pre>\n<h3>3.2 Inject Translation Service<\/h3>\n<p>To start working with internationalization we\u2019ll need to import the Translation Service in <code>src\/app\/app.component.ts<\/code> file.<\/p>\n<p><span style=\"text-decoration: underline\"><em>app.component.ts<\/em><\/span><\/p>\n<pre class=\"brush:js; wrap-lines:false;\">import { Component } from '@angular\/core';\n\/\/ Importing the translator service.\nimport { TranslateService } from '@ngx-translate\/core';\n\n@Component({\n  selector: 'app-root',\n  templateUrl: '.\/app.component.html',\n  styleUrls: ['.\/app.component.css']\n})\n\nexport class AppComponent {\n  title = 'Angular Internationalization tutorial';\n\n  \/\/ Setting the default language of the application.\n  constructor(private translate: TranslateService) {\n    translate.setDefaultLang('en');\n  }\n\n  \/\/ Method to change the language.\n  switchLanguage(language: string) {\n    this.translate.use(language);\n  }\n}\n<\/pre>\n<h3>3.3 Creating Translations<\/h3>\n<p>Remember to create some translations files inside the <code>assets\/i18n<\/code> folder. For this example, we have created <code>en.json<\/code> and <code>fr.json<\/code> files.<\/p>\n<h3>3.4 Translating Text<\/h3>\n<p>Add the following code to <code>src\/app\/app.component.html<\/code> for translating the language in a native language. Do remember to include the <code>translate<\/code> directive for providing internationalization support.<\/p>\n<p><span style=\"text-decoration: underline\"><em>app.component.html<\/em><\/span><\/p>\n<pre class=\"brush:html; wrap-lines:false;\">&lt;div class=\"container\"&gt;\n  &lt;h2 align=\"center\" class=\"text-info\"&gt;{{title}}&lt;\/h2&gt;\n  &lt;hr \/&gt;\n\n  &lt;div&gt;\n    &lt;p translate&gt;Title&lt;\/p&gt;\n    &lt;p&gt;{{ 'Intro' | translate }}&lt;\/p&gt;\n  &lt;\/div&gt;\n\n  &lt;div&gt;\n    &lt;button class=\"btn btn-info\" (click)=\"switchLanguage('en')\"&gt;en&lt;\/button&gt;&lt;br\/&gt;&lt;br\/&gt;\n    &lt;button class=\"btn btn-info\" (click)=\"switchLanguage('fr')\"&gt;fr&lt;\/button&gt;\n  &lt;\/div&gt;\n&lt;\/div&gt;\n<\/pre>\n<h2>4. Run the Application<\/h2>\n<p>As we are ready with all the changes, let us compile and run the angular application with <code>ng serve<\/code> command. Once the projects are successfully compiled and deployed, open the browser to test it.<\/p>\n<h2>5. Project Demo<\/h2>\n<p>Open your favorite browser and hit the angular application url (<code>http:\/\/localhost:4200\/<\/code>) to display the index page of the application.<\/p>\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"775\" height=\"226\" src=\"https:\/\/www.javacodegeeks.com\/wp-content\/uploads\/2019\/05\/angular-internationalization-project-demo-guide-1.jpg\" alt=\"Angular Internationalization - Welcome Page\" class=\"wp-image-92246\" srcset=\"https:\/\/www.javacodegeeks.com\/wp-content\/uploads\/2019\/05\/angular-internationalization-project-demo-guide-1.jpg 775w, https:\/\/www.javacodegeeks.com\/wp-content\/uploads\/2019\/05\/angular-internationalization-project-demo-guide-1-300x87.jpg 300w, https:\/\/www.javacodegeeks.com\/wp-content\/uploads\/2019\/05\/angular-internationalization-project-demo-guide-1-768x224.jpg 768w\" sizes=\"(max-width: 775px) 100vw, 775px\" \/><figcaption>Fig. 2: Welcome Page<\/figcaption><\/figure>\n<\/div>\n<p>The user can click the language button to toggle the application\u2019s text as per their native language. That is all for this tutorial and I hope the article served you whatever you were expecting for. Happy Learning and do not forget to share!<\/p>\n<h2>6. Conclusion<\/h2>\n<p>In this section, we learned how to support internationalization in the angular application. Developers can download the sample application as an Eclipse project in the <a href=\"#projectDownload\">Downloads<\/a> section.<\/p>\n<h2><a name=\"projectDownload\"><\/a>7. Download the Eclipse Project<\/h2>\n<p>This was a tutorial of internationalization in an angular application.<\/p>\n<div class=\"download\"><strong>Download<\/strong><br \/>You can download the full source code of this example here: <a target=\"_blank\" href=\"http:\/\/www.javacodegeeks.com\/wp-content\/uploads\/2019\/05\/angulari18n.zip\" rel=\"noopener noreferrer\"><strong>Angular Internationalization Example<\/strong><\/a><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Welcome readers, in this tutorial, we will implement internationalization in an angular application. 1. Introduction Angular is a Typescript-based open-source framework that helps developers build single page applications Offers Object-oriented features and supports the dynamic loading of the pages Supports Two-way data-binding, Property ([]), and Event (()) binding techniques Supports command-line-interface to easily initiate and &hellip;<\/p>\n","protected":false},"author":26931,"featured_media":49726,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1880],"tags":[740],"class_list":["post-92243","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-angular","tag-angular"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.5 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Angular Internationalization Example - Java Code Geeks<\/title>\n<meta name=\"description\" content=\"Interested to learn more about Angular? Then check out our detailed example on Angular Internationalization!\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.javacodegeeks.com\/2019\/05\/angular-internationalization-example.html\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Angular Internationalization Example - Java Code Geeks\" \/>\n<meta property=\"og:description\" content=\"Interested to learn more about Angular? Then check out our detailed example on Angular Internationalization!\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.javacodegeeks.com\/2019\/05\/angular-internationalization-example.html\" \/>\n<meta property=\"og:site_name\" content=\"Java Code Geeks\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/javacodegeeks\" \/>\n<meta property=\"article:published_time\" content=\"2019-05-29T04:00:46+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.javacodegeeks.com\/wp-content\/uploads\/2015\/12\/angularjs-logo.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"150\" \/>\n\t<meta property=\"og:image:height\" content=\"150\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Yatin Batra\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@javacodegeeks\" \/>\n<meta name=\"twitter:site\" content=\"@javacodegeeks\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Yatin Batra\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.javacodegeeks.com\\\/2019\\\/05\\\/angular-internationalization-example.html#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.javacodegeeks.com\\\/2019\\\/05\\\/angular-internationalization-example.html\"},\"author\":{\"name\":\"Yatin Batra\",\"@id\":\"https:\\\/\\\/www.javacodegeeks.com\\\/#\\\/schema\\\/person\\\/cda31a4c1965373fed40c8907dc09b8d\"},\"headline\":\"Angular Internationalization Example\",\"datePublished\":\"2019-05-29T04:00:46+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.javacodegeeks.com\\\/2019\\\/05\\\/angular-internationalization-example.html\"},\"wordCount\":521,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/www.javacodegeeks.com\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.javacodegeeks.com\\\/2019\\\/05\\\/angular-internationalization-example.html#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.javacodegeeks.com\\\/wp-content\\\/uploads\\\/2015\\\/12\\\/angularjs-logo.jpg\",\"keywords\":[\"Angular\"],\"articleSection\":[\"Angular\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.javacodegeeks.com\\\/2019\\\/05\\\/angular-internationalization-example.html#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.javacodegeeks.com\\\/2019\\\/05\\\/angular-internationalization-example.html\",\"url\":\"https:\\\/\\\/www.javacodegeeks.com\\\/2019\\\/05\\\/angular-internationalization-example.html\",\"name\":\"Angular Internationalization Example - Java Code Geeks\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.javacodegeeks.com\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.javacodegeeks.com\\\/2019\\\/05\\\/angular-internationalization-example.html#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.javacodegeeks.com\\\/2019\\\/05\\\/angular-internationalization-example.html#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.javacodegeeks.com\\\/wp-content\\\/uploads\\\/2015\\\/12\\\/angularjs-logo.jpg\",\"datePublished\":\"2019-05-29T04:00:46+00:00\",\"description\":\"Interested to learn more about Angular? Then check out our detailed example on Angular Internationalization!\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.javacodegeeks.com\\\/2019\\\/05\\\/angular-internationalization-example.html#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.javacodegeeks.com\\\/2019\\\/05\\\/angular-internationalization-example.html\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.javacodegeeks.com\\\/2019\\\/05\\\/angular-internationalization-example.html#primaryimage\",\"url\":\"https:\\\/\\\/www.javacodegeeks.com\\\/wp-content\\\/uploads\\\/2015\\\/12\\\/angularjs-logo.jpg\",\"contentUrl\":\"https:\\\/\\\/www.javacodegeeks.com\\\/wp-content\\\/uploads\\\/2015\\\/12\\\/angularjs-logo.jpg\",\"width\":150,\"height\":150},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.javacodegeeks.com\\\/2019\\\/05\\\/angular-internationalization-example.html#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.javacodegeeks.com\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Web Development\",\"item\":\"https:\\\/\\\/www.javacodegeeks.com\\\/category\\\/web-development\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"JavaScript\",\"item\":\"https:\\\/\\\/www.javacodegeeks.com\\\/category\\\/web-development\\\/javascript\"},{\"@type\":\"ListItem\",\"position\":4,\"name\":\"Angular\",\"item\":\"https:\\\/\\\/www.javacodegeeks.com\\\/category\\\/web-development\\\/javascript\\\/angular\"},{\"@type\":\"ListItem\",\"position\":5,\"name\":\"Angular Internationalization Example\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.javacodegeeks.com\\\/#website\",\"url\":\"https:\\\/\\\/www.javacodegeeks.com\\\/\",\"name\":\"Java Code Geeks\",\"description\":\"Java Developers Resource Center\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.javacodegeeks.com\\\/#organization\"},\"alternateName\":\"JCG\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.javacodegeeks.com\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.javacodegeeks.com\\\/#organization\",\"name\":\"Exelixis Media P.C.\",\"url\":\"https:\\\/\\\/www.javacodegeeks.com\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.javacodegeeks.com\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.javacodegeeks.com\\\/wp-content\\\/uploads\\\/2022\\\/06\\\/exelixis-logo.png\",\"contentUrl\":\"https:\\\/\\\/www.javacodegeeks.com\\\/wp-content\\\/uploads\\\/2022\\\/06\\\/exelixis-logo.png\",\"width\":864,\"height\":246,\"caption\":\"Exelixis Media P.C.\"},\"image\":{\"@id\":\"https:\\\/\\\/www.javacodegeeks.com\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/javacodegeeks\",\"https:\\\/\\\/x.com\\\/javacodegeeks\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.javacodegeeks.com\\\/#\\\/schema\\\/person\\\/cda31a4c1965373fed40c8907dc09b8d\",\"name\":\"Yatin Batra\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.javacodegeeks.com\\\/wp-content\\\/uploads\\\/2022\\\/12\\\/Yatin.batra_.jpg\",\"url\":\"https:\\\/\\\/www.javacodegeeks.com\\\/wp-content\\\/uploads\\\/2022\\\/12\\\/Yatin.batra_.jpg\",\"contentUrl\":\"https:\\\/\\\/www.javacodegeeks.com\\\/wp-content\\\/uploads\\\/2022\\\/12\\\/Yatin.batra_.jpg\",\"caption\":\"Yatin Batra\"},\"description\":\"An experience full-stack engineer well versed with Core Java, Spring\\\/Springboot, MVC, Security, AOP, Frontend (Angular &amp; React), and cloud technologies (such as AWS, GCP, Jenkins, Docker, K8).\",\"sameAs\":[\"https:\\\/\\\/www.javacodegeeks.com\"],\"url\":\"https:\\\/\\\/www.javacodegeeks.com\\\/author\\\/yatin-batra\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Angular Internationalization Example - Java Code Geeks","description":"Interested to learn more about Angular? Then check out our detailed example on Angular Internationalization!","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.javacodegeeks.com\/2019\/05\/angular-internationalization-example.html","og_locale":"en_US","og_type":"article","og_title":"Angular Internationalization Example - Java Code Geeks","og_description":"Interested to learn more about Angular? Then check out our detailed example on Angular Internationalization!","og_url":"https:\/\/www.javacodegeeks.com\/2019\/05\/angular-internationalization-example.html","og_site_name":"Java Code Geeks","article_publisher":"https:\/\/www.facebook.com\/javacodegeeks","article_published_time":"2019-05-29T04:00:46+00:00","og_image":[{"width":150,"height":150,"url":"https:\/\/www.javacodegeeks.com\/wp-content\/uploads\/2015\/12\/angularjs-logo.jpg","type":"image\/jpeg"}],"author":"Yatin Batra","twitter_card":"summary_large_image","twitter_creator":"@javacodegeeks","twitter_site":"@javacodegeeks","twitter_misc":{"Written by":"Yatin Batra","Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.javacodegeeks.com\/2019\/05\/angular-internationalization-example.html#article","isPartOf":{"@id":"https:\/\/www.javacodegeeks.com\/2019\/05\/angular-internationalization-example.html"},"author":{"name":"Yatin Batra","@id":"https:\/\/www.javacodegeeks.com\/#\/schema\/person\/cda31a4c1965373fed40c8907dc09b8d"},"headline":"Angular Internationalization Example","datePublished":"2019-05-29T04:00:46+00:00","mainEntityOfPage":{"@id":"https:\/\/www.javacodegeeks.com\/2019\/05\/angular-internationalization-example.html"},"wordCount":521,"commentCount":0,"publisher":{"@id":"https:\/\/www.javacodegeeks.com\/#organization"},"image":{"@id":"https:\/\/www.javacodegeeks.com\/2019\/05\/angular-internationalization-example.html#primaryimage"},"thumbnailUrl":"https:\/\/www.javacodegeeks.com\/wp-content\/uploads\/2015\/12\/angularjs-logo.jpg","keywords":["Angular"],"articleSection":["Angular"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.javacodegeeks.com\/2019\/05\/angular-internationalization-example.html#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.javacodegeeks.com\/2019\/05\/angular-internationalization-example.html","url":"https:\/\/www.javacodegeeks.com\/2019\/05\/angular-internationalization-example.html","name":"Angular Internationalization Example - Java Code Geeks","isPartOf":{"@id":"https:\/\/www.javacodegeeks.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.javacodegeeks.com\/2019\/05\/angular-internationalization-example.html#primaryimage"},"image":{"@id":"https:\/\/www.javacodegeeks.com\/2019\/05\/angular-internationalization-example.html#primaryimage"},"thumbnailUrl":"https:\/\/www.javacodegeeks.com\/wp-content\/uploads\/2015\/12\/angularjs-logo.jpg","datePublished":"2019-05-29T04:00:46+00:00","description":"Interested to learn more about Angular? Then check out our detailed example on Angular Internationalization!","breadcrumb":{"@id":"https:\/\/www.javacodegeeks.com\/2019\/05\/angular-internationalization-example.html#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.javacodegeeks.com\/2019\/05\/angular-internationalization-example.html"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.javacodegeeks.com\/2019\/05\/angular-internationalization-example.html#primaryimage","url":"https:\/\/www.javacodegeeks.com\/wp-content\/uploads\/2015\/12\/angularjs-logo.jpg","contentUrl":"https:\/\/www.javacodegeeks.com\/wp-content\/uploads\/2015\/12\/angularjs-logo.jpg","width":150,"height":150},{"@type":"BreadcrumbList","@id":"https:\/\/www.javacodegeeks.com\/2019\/05\/angular-internationalization-example.html#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.javacodegeeks.com\/"},{"@type":"ListItem","position":2,"name":"Web Development","item":"https:\/\/www.javacodegeeks.com\/category\/web-development"},{"@type":"ListItem","position":3,"name":"JavaScript","item":"https:\/\/www.javacodegeeks.com\/category\/web-development\/javascript"},{"@type":"ListItem","position":4,"name":"Angular","item":"https:\/\/www.javacodegeeks.com\/category\/web-development\/javascript\/angular"},{"@type":"ListItem","position":5,"name":"Angular Internationalization Example"}]},{"@type":"WebSite","@id":"https:\/\/www.javacodegeeks.com\/#website","url":"https:\/\/www.javacodegeeks.com\/","name":"Java Code Geeks","description":"Java Developers Resource Center","publisher":{"@id":"https:\/\/www.javacodegeeks.com\/#organization"},"alternateName":"JCG","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.javacodegeeks.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.javacodegeeks.com\/#organization","name":"Exelixis Media P.C.","url":"https:\/\/www.javacodegeeks.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.javacodegeeks.com\/#\/schema\/logo\/image\/","url":"https:\/\/www.javacodegeeks.com\/wp-content\/uploads\/2022\/06\/exelixis-logo.png","contentUrl":"https:\/\/www.javacodegeeks.com\/wp-content\/uploads\/2022\/06\/exelixis-logo.png","width":864,"height":246,"caption":"Exelixis Media P.C."},"image":{"@id":"https:\/\/www.javacodegeeks.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/javacodegeeks","https:\/\/x.com\/javacodegeeks"]},{"@type":"Person","@id":"https:\/\/www.javacodegeeks.com\/#\/schema\/person\/cda31a4c1965373fed40c8907dc09b8d","name":"Yatin Batra","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.javacodegeeks.com\/wp-content\/uploads\/2022\/12\/Yatin.batra_.jpg","url":"https:\/\/www.javacodegeeks.com\/wp-content\/uploads\/2022\/12\/Yatin.batra_.jpg","contentUrl":"https:\/\/www.javacodegeeks.com\/wp-content\/uploads\/2022\/12\/Yatin.batra_.jpg","caption":"Yatin Batra"},"description":"An experience full-stack engineer well versed with Core Java, Spring\/Springboot, MVC, Security, AOP, Frontend (Angular &amp; React), and cloud technologies (such as AWS, GCP, Jenkins, Docker, K8).","sameAs":["https:\/\/www.javacodegeeks.com"],"url":"https:\/\/www.javacodegeeks.com\/author\/yatin-batra"}]}},"_links":{"self":[{"href":"https:\/\/www.javacodegeeks.com\/wp-json\/wp\/v2\/posts\/92243","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.javacodegeeks.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.javacodegeeks.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.javacodegeeks.com\/wp-json\/wp\/v2\/users\/26931"}],"replies":[{"embeddable":true,"href":"https:\/\/www.javacodegeeks.com\/wp-json\/wp\/v2\/comments?post=92243"}],"version-history":[{"count":0,"href":"https:\/\/www.javacodegeeks.com\/wp-json\/wp\/v2\/posts\/92243\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.javacodegeeks.com\/wp-json\/wp\/v2\/media\/49726"}],"wp:attachment":[{"href":"https:\/\/www.javacodegeeks.com\/wp-json\/wp\/v2\/media?parent=92243"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.javacodegeeks.com\/wp-json\/wp\/v2\/categories?post=92243"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.javacodegeeks.com\/wp-json\/wp\/v2\/tags?post=92243"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}