Question

在Ionic3应用程序中，我可以为ngx-translate加载语言JSON的方法是什么？目前在github上提到的关于保留资产文件夹中每种语言的JSON文件的方法。这种方法的问题是，每次我必须添加新的语言支持时，我必须发布新版本的应用程序。有没有办法从Firebase加载JSON？

Answer 1

我能够创建一个可从Firebase获取的新TranslateLoader。这是代码：

import {AngularFireDatabase} from 'angularfire2/database';
import {TranslateLoader} from "@ngx-translate/core";

export class TranslateFirebaseLoader implements TranslateLoader {
    constructor(public db : AngularFireDatabase) {}

    /**
     * Gets the translations from firebase
     * @param lang
     * @returns {any}
     */
    public getTranslation(lang: string): any {
      return this.db.list('/translations/'+lang)
            .map(data => {
              let fields={};
              data.forEach(field =>{
                fields[field.$key]=field.$value;
              });
              return fields;
            });
    }
}

Answer 2

好的，我设法让它像这样工作：

app.module.ts

import { TranslateModule, TranslateLoader } from '@ngx-translate/core';

// Should work with "AngularFireDatabase" too. But I want it to work offline
import { AngularFireOfflineDatabase } from 'angularfire2-offline/database';

import { TranslateFirebaseLoader } from './TranslateFirebaseLoader';

export function createTranslateLoader(db: AngularFireOfflineDatabase) {
  return new TranslateFirebaseLoader(db, '/my/firebase/path');
}

@NgModule({
  imports: [
    // ...
    TranslateModule.forRoot({
      loader: {
        provide: TranslateLoader,
        useFactory: (createTranslateLoader),
        deps: [ AngularFireOfflineDatabase ]
      }
    }),
    // ...
  ],
  // ...
})
export class AppModule {}

TranslateFirebaseLoader.ts

const TranslateFirebaseLoader = (function () {
  function TranslateFirebaseLoader(db, path) {
    this.db = db;
    this.path = path;
  }

  /**
   * Gets the translations from the server
   * @param langCode
   * @returns {any}
   */
  TranslateFirebaseLoader.prototype.getTranslation = function(langCode) {
    return this.db.object(`${this.path}/${langCode}`);
  };

  return TranslateFirebaseLoader;
}());

export { TranslateFirebaseLoader };

显然，要使其工作，请更改您在Firebase上使用的路径（不包含语言代码）。例如，在这种情况下，如果语言代码“en”处于活动状态，应用程序将尝试从/my/firebase/path/en获取数据。

ngx-translate：从ionic3中的firebase加载i18n json

2 个答案: