Eğik 5 Hizmet ben 5 Açısal kullanıyorum yerel .json dosyasını

Question

okumak ve ben kullanarak bir hizmet oluşturduk açısal-cli

Ne yapmak istiyorum için yerel json dosyasını okur bir hizmet yaratmaktır 5.

Bu benim ne var açısal ... Ben

import { Injectable } from '@angular/core'; 
import { HttpClientModule } from '@angular/common/http'; 

@Injectable() 
export class AppSettingsService { 

    constructor(private http: HttpClientModule) { 
    var obj; 
    this.getJSON().subscribe(data => obj=data, error => console.log(error)); 
    } 

    public getJSON(): Observable<any> { 
    return this.http.get("./assets/mydata.json") 
     .map((res:any) => res.json()) 
     .catch((error:any) => console.log(error)); 

    } 

} 

Bunu nasıl bitmiş alabilirsiniz ... biraz şaşırıp?

Answer 1

İlk Yeni HttpClient size varsayılan olarak tepki gövdesini verecektir çünkü, nihayet emin olun bunu artık gerek kalmayacak sen .map((res:any) => res.json()) kaldırmak zorunda ikinci şey HttpClient ve değil HttpClientModule, enjekte etmek zorunda sen misin içinde ithalat HttpClientModuleAppModule :

import { HttpClient } from '@angular/common/http'; 
import { Observable } from 'rxjs/Observable'; 

    constructor(private http: HttpClient) { 
     this.getJSON().subscribe(data => { 
      console.log(data) 
     }); 
    } 

    public getJSON(): Observable<any> { 
     return this.http.get("./assets/mydata.json") 
    } 

sizin Bileşeni için bu eklemek için:

@Component({ 
    selector: 'mycmp', 
    templateUrl: 'my.component.html', 
    styleUrls: ['my.component.css'] 
}) 
export class MyComponent implements OnInit { 
    constructor(
     private appSettingsService : AppSettingsService 
    ) { } 

    ngOnInit(){ 
     this.appSettingsService.getJSON().subscribe(data => { 
      console.log(data) 
     }); 
    } 
} 

Answer 2

Alternatif bir çözümünüz var, doğrudan json'unuzu içeri aktarıyorsunuz. derlemek için

, Kodunuzla Örneğin

import { data_json } from '../../path_of_your.json'; 

console.log(data_json)