2017-12-12 26 views
4

커스텀 도메인 (예 : firebase URL로 리다이렉트하는 www.something.com)을 가진 Firebase 호스팅 서비스에서 호스팅되는 앵귤러 4 앱이 있습니다. i18n 국제화를 사용했고 질문은 다음과 같습니다 : 사용자 국가에 따라 올바른 컴파일 된 응용 프로그램을 제공하는 가장 좋은 방법은 무엇입니까? 이 순간에는 온라인 표준 만 있고, 예를 들어 이탈리아에서 온 사람이라면 버전을 제공하고 싶습니다.효과적인 AOT 언어를 제공하는 방법 Firebase 호스팅의 각도 앱은 무엇입니까?

감사합니다.

답변

2

나는 동일한 문제가 있었지만 해결책을 찾지 못했습니다. 그래서 i18n 국제화를 사용할 또 다른 접근법을 만들었습니다. 이 방법으로 단일 빌드에서 다중 언어를 사용할 수 있습니다.

나는이 최선의 방법입니다 있는지 확실하지 않습니다, 그러나 이것은 내 꺼야 :

내가 창을 제공하는 매우 간단한 서비스를 만들었습니다. 그것을 루트로 제공하십시오!

@Pipe({name: 'translate'}) 
export class TranslationPipe implements PipeTransform { 
    constructor(private translationService: TranslationService) { 

    } 

    transform(value: string) { 
    return this.translationService.getTranslation(value); 
    } 
} 

파이프는이 번역 서비스를 사용합니다 :

텍스트를 들어

@Pipe({name: 'datepipe', pure: true}) 
export class MyDatePipe extends DatePipe implements PipeTransform { 
    constructor(private win: WindowRef) { 
    super(win.ln); 
    } 

    transform(value: any, pattern?: string): string | null { 
    return super.transform(value, pattern); 
    } 
} 

내가 아주 간단한 파이프를 만든 다음 defaut에 각 파이프

function _window(): any { 
    // return the global native browser window object 
    return window; 
} 

@Injectable() 
export class WindowRef { 
    get nativeWindow(): any { 
    return _window(); 
    } 

    public ln = 'en'; //default language 


    constructor() { 
    try { 
     if (!isNullOrUndefined(this.nativeWindow.navigator.language) && this.nativeWindow.navigator.language !== '') { 
     let lang = this.nativeWindow.navigator.language; 
     if (lang.indexOf('-') >= 0) { 
      lang = lang.split('-')[0]; //replace en-us with en. 
     } 
     this.ln = lang; 
     } 
    } finally { 
    } 
    } 
} 

나는 간단한 래퍼를 생성
@Injectable() 
export class TranslationService { 
    lng: string = 'en'; 

    nl: Array<KV> = [ 
    {key: 'Hello', value: 'Hallo'}, 
    ]; 

    languages = [ 
    {key: 'nl', value: this.nl} 

    ]; 

    constructor() { 
    if (!isNullOrUndefined(navigator.language)) { 
     this.lng = navigator.language; 
    } 
    if (this.lng.indexOf('-') >= 0) { 
     this.lng = this.lng.split('-')[0]; 
    } 
    } 

    getTranslation(key: string): string { 
    return this.findByKey(this.findByKey(this.languages, this.lng), key) || key; 
    } 

    private findByKey(list: { key, value }[], key: string): any { 
    if (!isNullOrUndefined(list)) { 
     for (let i = 0; i < list.length; i++) { 
     if (list[i].key === key) { 
      return list[i].value; 
     } 
     } 
    } 
    return undefined; 
    } 
} 

export class KV { 
    key: string; 
    value: string; 
} 

당신이 유용하게 사용할 수 있기를 바랍니다.

+0

안녕하세요, 솔루션을 좋아하지만이 방법으로 번역 런타임을 만들고 각도 국제화 (i18n)를하지 않아도됩니다. 내 주요 질문은 가능한 경우 해당 솔루션으로 앱을 제공하는 것입니다. (그렇지 않으면 i18n의 유틸리티가 보이지 않습니다.) –

+0

이것이 이상적은 아니지만 firebase 호스팅을 가진 솔루션을 찾을 수 없었습니다. 이것이 내가 생각해내는 최고의 방법입니다. 여러 인스턴스를 배포 할 수있는 솔루션을보고 싶습니다. –