Httpclient не может читать JSON локально или на сервере - PullRequest
Новая
       30

Httpclient не может читать JSON локально или на сервере

0 голосов
/ 31 мая 2019

Я использую модуль HttpClient, встроенный в angular 7, для чтения JSON с сервера. При использовании HttpClient всегда возвращается

ОШИБКА TypeError: Невозможно прочитать свойство 'get' из неопределенного при нажатии ../ src / app / info / info.component.ts.info.getVars (info.component.ts: 37) в ZoneDelegate.push ../ node_modules / zone.js / dist / zone.js.ZoneDelegate.invokeTask (zone.js: 423) в Object.onInvokeTask (core.js: 17290) в ZoneDelegate.push ../ node_modules / zone.js / dist / zone.js.ZoneDelegate.invokeTask (zone.js: 422) в Zone.push ../ node_modules / zone.js / dist / zone.js.Zone.runTask (zone.js: 195) при нажатии ../ node_modules / zone.js / dist / zone.js.ZoneTask.invokeTask (zone.js: 498) в ZoneTask.invoke (zone.js: 487) по таймеру (zone.js: 2281)

Я подумал, что это означает, что JSON не может быть найден / или не указан

Я попытался прочитать JSON с сервера (безуспешно), и я поместил JSON в папку активов, чтобы прочитать его, и я получил ту же ошибку. Я знаю, что он должен работать в папке активов, потому что я могу импортировать его из папки ресурсов без проблем:
import infoJson from '../../assets/info.json

Это то, что я сейчас пробовал: ( .component.ts ) 

import { HttpClient } from '@angular/common/http'

export class VehicleinfoComponent implements OnInit {
    constructor(private httpService: HttpClient ) { }

    getVars() {
        this.httpService.get('../../assets/info.json').subscribe(data => {
          console.log(data);
        })
      }
}

Я также пытался создать службу, но получаю ту же ошибку: ( .service.ts ): 

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

@Injectable({
  providedIn: 'root'
})
export class GetJsonService {

  constructor(private http: HttpClient) { }

  public getJsonInfo(): Observable<any> {
    return this.http.get('./assets/info.json')
  }
}

.component.ts 

import { GetJsonService } from '../get-json.service'

export class VehicleinfoComponent implements OnInit {
    constructor(private GetJson: GetJsonService) { }

    getVars() {
        this.GetJson.getJsonInfo().subscribe(data => {
          console.log(data);
        })
    }
}

Причина, по которой я хочу использовать HttpClient, заключается в том, что JSON автоматически обновляется с новыми данными, и я хочу иметь возможность читать и отображать это.

Любая помощь приветствуется.

EDIT
Это пример JSON, который я пытаюсь прочитать: 

{
    "playerdata": [
        {
            "USER_ID": "7a8f",
            "Status": 1,
            "Start_Time": "2016-12-21 09:41:57",
            "Finish_Time": "2016-12-21 09:43:17",
        }
    ]
}

Кроме того, это мой app.module.ts: 

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

@NgModule({
  declarations: [
    //components declared
  ],
  imports: [
    HttpClientModule,
    //other imports here
  ],
  providers: [  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

1 Ответ

0 голосов
/ 31 мая 2019

this.httpService здесь httpService означает undefined, что означает, что инъекция не произошла.

Дважды проверьте конфигурацию вашего модуля, если у вас есть соответствующие провайдеры, заявленные (и это работает, если заказ).

Импорт импорта должен выглядеть следующим образом: 

import { NgModule }         from '@angular/core';
import { BrowserModule }    from '@angular/platform-browser';
import { HttpClientModule } from '@angular/common/http';

@NgModule({
  imports: [
    BrowserModule,
    HttpClientModule, // HERE
  ],
  declarations: [
    AppComponent,
  ],
  bootstrap: [ AppComponent ]
})
export class AppModule {}
...