首页 文章

从Angular / Nativescript读取本地JSON文件

提问于
浏览 次
0

我尝试在以下位置放置 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：assets / i18n / en.json console.log＃2：true 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) 时我得到一个异常 . 但为什么？首先我认为文件不在那里，但我从我的存在测试中得到了真实 . 因此，当设备/模拟器运行时，文件似乎存在，但我无法读取其内容？

有任何想法吗？

谢谢
索伦

angular nativescript angular2-nativescript

3 回答

  • 0

    我修好了它！ HttpClient不适用于Native（是的，我的问题是本机设备上的Nativescript，没有http服务器提供文件，是的，我有权访问本地存储） . 我的代码工作，但* .json文件没有传输到构建包 . 我必须在“CopyWebpackPlugin”的tns部分中添加mt webpack.config.js中的那些，然后一切正常:)我无法推出“File.exists”，因为我对“.getFile”的调用创建了一个空文件 .

    回复于
  • 0

    把它想象成运行JS代码的环境 .

    如果你在node.js下运行，你的代码是有意义的，它会起作用 .

    如果您在浏览器中运行，出于安全原因，本地文件系统是遥不可及的 . 但是，您应该能够从服务器获取文件，也可以从本地沙箱中进行写入和读取 .

    但是有这个API，看看它是否适合你：https://developer.mozilla.org/en-US/docs/Web/API/File_and_Directory_Entries_API

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

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

    请分享游乐场示例，以便轻松确定问题所在 . 在您之间甚至可以简单地导入JSON .

    例如， en.ts

    export const languageJSON = {
   ....
};

    将其导入为

    const languageJSON = require(`${this.prefix}${lang}${this.suffix}`).languageJSON;

    由于路径是动态的，只需确保您的webpack构建理解它 .

    回复于

相关问题