Anyone know how to import a text file as a string in Ionic 2? I found this: [image] systemjs/plugin-text plugin-text - Text plugin But I’m not sure how to use it, or if it’s even neccessary. I’m using Ionic 2.0.0-rc.3.

Hi @meatrobot I like to use HTTP services to read asynchronously for me. Here’s how I import JSON data (you’ll need to change the res.json line to read in plain text … essentially, you get to skip the step of parsing). In your *.ts file, add these libraries… import { Http } from ‘@angular/http’; import ‘rxjs/add/operator/map’; Create a member var to hold the string public _robotOverlords: any[] = []; Make sure your constructor has an HTTP variable injected constructor(public navCtrl: NavController, public _http: Http) { … } Within the constructor, you’ll want to import the text file (again, for me, it’s JSON data) this._http.get(‘my/local/path/xyz.txt’).map(res => res.json()).subscribe(data => { this._robotOverlords = data; }); my/local/path/xyz.txt will need to be in the www folder. The full path would be MyProject/www/my/local/path/xyz.txt I think that since you don’t need to parse, you won’t need to import the rxjs map operator. So that’ll shorten your code further. I hope that helps! Ryan

1 other thing to note: if you store your text file locally – that is, in the www folder – you may need to create your own subfolder. I’m not certain if RC3 cleans the www folder every time you build, but the older versions did. Creating your own subfolder protects the data from being deleted (cleaned).

@ryanlogsdon Thanks a ton, this worked for me! I did in fact go down the http path, but had given up since I didn’t quite understand how http worked in Angular 2 and that I had to call subscribe(). Minor differences: I only needed the first import, and not “rxjs/add/operator/map” I’m loading an html file, so it was res.text() instead of res.json()

Can you fans of using Http here explain why you prefer it to using webpack’s require?

Honest answer: http is the 1st way I read about when I started out. Correct me, but I imagine that chaining function calls would not work with readFile('my/path/to/file.txt').map(...) so I’d have to write a little more code that way. Plus, data subscriptions are elegant. :sunglasses:

Somewhere around Beta 12 or RC1, it switched from Webpack to Rollup. Those were dark times. RC2 or so migrated to Webpack2.

Hi @meatrobot! I’m trying to load this in as well and had an error pop up in VSC when defining a data type for the data captured from my text file. Is it ok to leave this undefined? I assume by using res.text() that the data will auto append to string, at least VSC seems to think so… Any chance I could get an example of your working ts and html files for reference? I’m trying to use ngFor to generate multiple slides from my text file but not sure how to go about doing this. This thread has been a big help though, thank you all.

Load a text file as a string in Ionic 2

Ionic Framework ionic-v3

meatrobot December 14, 2016, 4:50pm 7

It’s my understanding that Ionic 2 used webpack at one point, but no longer does?

Require for json files?

Topic		Replies	Views
How to read a .txt file that was downloaded locally? ionic-v3	4	3117	August 17, 2016
How to read text file in ionic ionic-v1	0	777	December 7, 2016
Impossible to retrieve text json ionic ionic-v1	1	650	February 16, 2017
Read files stored in "src" folder Ionic Framework	8	2697	November 30, 2018
How to save a json-File so that it is readable in ionic ionic-v3	2	671	May 27, 2018

Load a text file as a string in Ionic 2

Related topics