Question

我尝试将en.json文件放在以下位置：

src/assets/i18n/en.json
src/app/assets/i18n/en.json

然后我尝试像这样读取文件：

import {knownFolders, File} from 'tns-core-modules/file-system';
import { TranslateModule, TranslateLoader } from '@ngx-translate/core';
import { Observable } from 'rxjs';

export class TranslateFileLoader implements TranslateLoader {
    constructor(public prefix: string = 'assets/i18n/', public suffix: string = '.json') {}

    public getTranslation(lang: string): Observable<Object> {
      const appFolder = knownFolders.currentApp(); // Havet tried with knownFolders.documents() also
      console.log(`${this.prefix}${lang}${this.suffix}`);
      const cfgFile = appFolder.getFile(`${this.prefix}${lang}${this.suffix}`);
      console.log(File.exists(cfgFile.path));
      console.log(cfgFile.path);
      const fileData = cfgFile.readTextSync();
      console.log(fileData);
      return JSON.parse(fileData);
    }
}

console.log＃1：资产/i18n/en.json
console.log＃2：是
  console.log＃3：   /data/data/org.nativescript.playground/files/app/assets/i18n/en.json
  console.log＃4：

是的，路径看起来不错，File.exists(cfgFile.path)返回true，但是fileData为空，因此当我JSON.parse(fileData)时出现异常。但为什么？首先，我认为这些文件不存在，但是从我的存在测试中可以得出结论。因此，当设备/仿真器正在运行时，文件似乎在那里，但我无法读取其内容？

有什么想法吗？

谢谢
索伦

Answer 1

我修复了！ HttpClient在本机上不起作用（是我的问题是在本机设备上使用Nativescript，那里没有提供文件的http服务器，是的，我确实可以访问本地存储）。我的代码有效，但是* .json文件没有转移到构建包中。我必须将它们添加到“ CopyWebpackPlugin”的tns部分的mt webpack.config.js中，然后一切正常：)我无法使用“ File.exists”，因为我对“ .getFile”的调用创建了一个空文件。

Answer 2

请分享游乐场示例，以便轻松确定问题出在哪里。您之间甚至可以简单地将JSON导入为。

例如， en.ts

templateData

将其导入为

export const languageJSON = {
   ....
};

由于路径是动态的，因此请确保您的webpack构建能够理解它。

Answer 3

考虑一下您正在运行JS代码的环境。

如果您在node.js下运行，则代码很有意义，并且可以正常工作。

如果在浏览器中运行，出于安全原因，本地文件系统无法访问。但是，您应该能够从服务器中获取文件，也可能能够从本地沙箱中进行读写。

但是有此API，请查看它是否对您有用：https://developer.mozilla.org/en-US/docs/Web/API/File_and_Directory_Entries_API

在我的项目中，我经常将本地化存储在json文件中，并使用：p成功获取它们。

  import { HttpClient } from '@angular/common/http';
  ..
  constructor(private http: HttpClient) {} 
  ..
  this.http.get(this.urlToFile, { responseType: 'wherever you need here text|json'}).map(res => {...});

从Angular / Nativescript读取本地JSON文件

3 个答案: