美发店学校微信小程序_怎么在Angular8.0下使用ng

阅读  ·  发布日期 2021-01-07 12:22  ·  admin
如何在Angular8.0下使用ngx-translate进行国际化配置       这篇文章主要介绍了如何在Angular8.0下使用ngx-translate进行国际化配置,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { AppComponent } from './ponent'; // import ngx-translate and the http loader import {TranslateLoader, TranslateModule} from '@ngx-translate/core'; import {TranslateHttpLoader} from '@ngx-translate/http-loader'; import {HttpClient, HttpClientModule} from 'mon/http'; @NgModule({ declarations: [ AppComponent imports: [ BrowserModule, // ngx-translate and the loader module HttpClientModule, TranslateModule.forRoot({ loader: { provide: TranslateLoader, useFactory: HttpLoaderFactory, de凡科抠图: [HttpClient] providers: [], bootstrap: [AppComponent] export class AppModule { } // required pilation export function HttpLoaderFactory(http: HttpClient) { return new TranslateHttpLoader(http);

ponent.ts中设置初始值

import {Component} from '@angular/core';
import {TranslateService} from '@ngx-translate/core';
@Component({
 selector: 'app-root',
 ',
 styleUrls: ['./ponent.scss']
export class AppComponent {
 constructor(private translate: TranslateService) {
 translate.setDefaultLang('en');

四.在assets/i18n文件下创建让我们为英文翻译创建相关语言JSON文件,如en.json文件

 "demo.title": "Translation demo",
 "demo.text": "This is a simple demonstration app for ngx-translate"
<中使用
 div 
 !-- translation: translation pipe -- 
 h1 {{ 'demo.title' | translate }} /h1 
 !-- translation: directive (key as attribute)-- 
 p [translate]="'demo.text'" /p 
 !-- translation: directive (key as content of element) -- 
 p translate demo.text /p 
 /div 

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持凡科。