如何从 txt URL 获取文本？如何使用 Angular 7 中的 Filereader？

Question

“我想从 txt url 中获取文本数据，并在 angular web 中获取它。如何从 txt URL 获取文本？如何使用 Angular 7 中的 Filereader ???”

“这是针对 Angular 7 的。”

<a (click)="getTextFile()">Check</a> 

import {Component} from '@angular/core';
import {FormControl} from '@angular/forms';
import {Observable} from 'rxjs';
import {map, startWith} from 'rxjs/operators';
import {
  HttpClient,
  HttpRequest,
  HttpResponse,
  HttpParams,
  HttpHeaders
} from '@angular/common/http';




@Component({
  selector: 'autocomplete-overview-example',
  templateUrl: 'autocomplete-overview-example.html',
  styleUrls: ['autocomplete-overview-example.css'],
})
export class AutocompleteOverviewExample {
 text:any;

  constructor(
     private http: HttpClient,
  ) {

  }


  getTextFile():void{
  this.http.get('https://creamson-intelli.slack.com/files/UFL3QQFP0/FL4N4SNFJ/young_ruskin_bond.txt').subscribe((data) => {
    this.text=data;
    console.log(this.text);
})
}
} 

Answer 1

检查一下

Working Example

service.ts

  getRawData(): Observable<any> {
    const api = 'https://www.w3.org/TR/PNG/iso_8859-1.txt';
    return this.httpClient.get(api,{ responseType: 'text' });    
  }

组件.ts

import { Component, OnInit } from '@angular/core';

import { HttpClient } from '@angular/common/http';
import { AppService } from './app.service';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent implements OnInit {
  name = 'Angular 5';
  rawlist: any;

  constructor(private appService: AppService) {}

  ngOnInit() {}

  getRawData() {
    this.appService
      .getRawData()
      .subscribe(
        data => this.rawlist=data,
        error => console.log(error)
      );
  }

}

.html

<button (click)="getRawData()">get raw data </button>

 {{rawlist }}