使用 Ionic 3 在页面模板内加载资产文件答案

【问题标题】：Load asset file inside page template with Ionic 3使用 Ionic 3 在页面模板内加载资产文件
【发布时间】：2017-06-18 01:08:31
【问题描述】：

我有一个页面ContentPage，它显示了我的应用程序的静态文件的内容。我页面的html文件如下（content.html）：

<ion-header>
  <ion-navbar>
    <ion-title>{{ lessonNumber }} - {{ pageNumber }}</ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>

  <!-- TXT CONTENT GOES HERE -->
  {{ txtContent }}

</ion-content>

我的静态文件在src/assets/txts/下

src
|_ app
|_ assets
   |_ txts
      |_ 1.txt
      |_ 2.txt
      |_ 3.txt
      |_ ...
|_ pages
|_ ...

ContentPage 打开时，我需要获取其中一个 txt 文件，例如 1.txt，并将其内容加载到 content.html 页面中。

这是我的页面代码：

import {Component} from "@angular/core";
import {IonicPage} from "ionic-angular";

@IonicPage()
@Component({
  selector: 'page-content',
  templateUrl: 'content.html',
})
export class ContentPage {

  lessonNumber: number;
  pageNumber: number;

  txtContent: string = '';

  constructor() {
    //FIXME - get txt contents
    //txtContent = ...
  }

}

我该怎么做？

是否有允许我获取这些文件的类或插件？

【问题讨论】：

标签： javascript angular ionic-framework ionic3

【解决方案1】：

您可以使用HTTP 请求从txt 文件中获取数据。你可以写在构造函数或服务中

constructor() {
    this.http.request('./txt/1.txt')
                     .map(res => res.text()    })
          .subscribe(text => {
            this.txtContent= text;
          });
 }

【讨论】：

这里有一些错别字。悬挂}的匹配{在哪里？