zoukankan      html  css  js  c++  java
  • angular2 国际化实现

    angular2国际化通过管道(pipe)的形式实现下载ng2-translate

    如何使用可以参照https://github.com/ocombe/ng2-translate

    自己写了一个小DEMO,可以在dev分支查看https://github.com/lyt308012546/ng2-webpack-demo

    import { Component } from '@angular/core';
    import { Http, HTTP_PROVIDERS } from '@angular/http';
    import {
        TranslateService,
        TranslateLoader,
        TranslatePipe,
        TranslateStaticLoader
    } from 'ng2-translate/ng2-translate';
    
    @Component({
        selector: 'translate',
        template: `
            <br>
            <br>
            <br>
            <button (click)="changeLang('en')">英文</button>
            <button (click)="changeLang('zh_cn')">中文</button>
            <br>
            <h1>{{ 'HELLO' | translate:{value: param} }}</h1>
        `,
        pipes: [TranslatePipe]
    })
    
    export class Translate {
        param: string = "world";
    
        // userLang: string = "en";
    
        constructor(public translate: TranslateService) {
            // var userLang = navigator.language.split('-')[0]; // use navigator lang if available
            // userLang = /(fr|en)/gi.test(userLang) ? userLang : 'en';
            // // this language will be used as a fallback when a translation isn't found in the current language
            // translate.setDefaultLang('zh_cn');
            // // the lang to use, if the lang isn't available, it will use the current loader to get them
            translate.use("zh_cn");
    
            //获取值
            console.log(this.translate.instant("HELLO"));
        }
    
        changeLang(userLang) {
            // the lang to use, if the lang isn't available, it will use the current loader to get them
            this.translate.use(userLang);
        }
    }
    
    export const TRANSLATE_PROVIDERS = [
        HTTP_PROVIDERS,
        {
            provide: TranslateLoader,
            useFactory: (http: Http) => new TranslateStaticLoader(http, 'assets/i18n', '.json'),
            deps: [Http]
        },
        TranslateService
    ];
  • 相关阅读:
    自主问题--KMP算法
    题解--luogu--CSP2019.S.Day2.T4--Emiya 家今天的饭
    浅谈——RMQ
    浅谈——LCA
    NOIP(si le)或者CSP初赛之——前序中序后序,前缀中缀后缀
    浅说——查分约束
    浅说——tarjan
    C++ RQNOJ 星门龙跃
    C++ 洛谷 1261:【例9.5】城市交通路网
    刷题
  • 原文地址:https://www.cnblogs.com/liuyt/p/5772037.html
Copyright © 2011-2022 走看看