Ionic ngx-translate 给我 asset/i18n/.json 404（未找到）

Question

在我的 Ionic 应用程序上，ngx-translate 在控制台上给我这条消息：

.... asset/i18n/.json 404（未找到）

有关 HttpErrorResponse 的其他详细信息

所以我在浏览器上的应用程序不断出现此错误，当我构建在手机上使用时，它只会触发一条包含此错误的警报消息并关闭应用程序

我的设置： 安卓。 “cordova-plugin-crosswalk-webview”：“^2.4.0”<- LITE "@ngx-translate/core": "^9.1.1", "@ngx-translate/http-loader": "^2.0.1", 离子3

这是我的app.module.ts

import { HttpClientModule, HttpClient } from '@angular/common/http';
import { TranslateModule, TranslateLoader } from '@ngx-translate/core';
import { TranslateHttpLoader } from '@ngx-translate/http-loader';

export function HttpLoaderFactory(http: HttpClient) {
  return new TranslateHttpLoader(http, '../assets/i18n/', '.json');
}

imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp),
    HttpClientModule,
    TranslateModule.forRoot({
        loader: {
            provide: TranslateLoader,
            useFactory: HttpLoaderFactory,
            deps: [HttpClient]
        }
    })

我看到其他用户遇到问题

export function HttpLoaderFactory(http: HttpClient) {
return new TranslateHttpLoader(http, '../assets/i18n/', '.json');

将其更改为 Http 而不是 HttpClient，但对我来说没有用。 Typescript 告诉我

http

必须是 HttpClient 类型。

这是我的app.component.ts

import { TranslateService } from '@ngx-translate/core';
.
.
.
constructor(
    private translateService: TranslateService,
    public platform: Platform,
    public statusBar: StatusBar,
    public splashScreen: SplashScreen
  ) {


    this.initializeApp();

  }

initializeApp() {
    this.platform.ready().then(() => {
      this.statusBar.styleDefault();
      this.splashScreen.hide();

      // this.setAppTranslation();
      this.translateService.addLangs(["en", "pt"]);
      this.translateService.setDefaultLang('en');
      this.translateService.use('en');

    });
  }

我已按照本教程将该功能应用到我的应用程序中： https://www.gajotres.net/ionic-2-internationalize-and-localize-your-app-with-angular-2/

任何人都可以帮助我至少理解吗？

我的assets/i18n文件夹有2个文件： en.json pt.json

Answer 1

我以前也遇到过这个问题，请尝试以下两件事：

将你的加载器更改为此（正如@Mohsen所说）：

return new TranslateHttpLoader(http, './assets/i18n/', '.json');

你的 useFactory 对此：

useFactory: (HttpLoaderFactory)

重要提示：确保您的资产文件夹位于此级别：

/ src / 资产 /

Answer 2

搜索

        key: "loadUrl",
        value: function(t, e) {
            var n = this;

然后添加，

if (t !== 未定义) t = t.replace("../../../app-assets/", "../../../control/app-assets/");

Answer 3

我在 Angular v18 中遇到了这个问题，因为

assets

文件夹现已成为

public

文件夹。切换文件夹名称和位置后（根据 v18 标准 - 它现在作为

src

目录的同级目录），我必须更改为使用此文件夹（我的

i18n

文件夹位于

public

内：

function HttpLoaderFactory(http: HttpClient) {
  return new TranslateHttpLoader(http, "i18n/", ".json?v=2.5.0");
}