Невозможно прочитать свойство 'post' из undefined: this.http.post ОШИБКА

Question

У меня есть следующие фрагменты кода в Angular:

export class GameComponent implements OnInit {

  @ViewChild('canvas', { static: true })
  canvas: ElementRef<HTMLCanvasElement>;  

  private ctx: CanvasRenderingContext2D;
  //public  map: (BrickComponent|TileComponent|PlayerComponent)[][];
  public harry: PlayerComponent;
  private http: HttpClient;
  private reponse : string;
  private confirme : number;
  private combat : number;
  private maxX : number;
  private maxY : number ;
  private map: number[][];
  private tab_monst : (MonsterComponent)[];
  json;

  ngOnInit(): void {
    this.ctx = this.canvas.nativeElement.getContext('2d');
    this.init();
  }

My Angular (внешний интерфейс) выполняет запрос POST с телом JSON и отправляет его на сервер как следующим образом:

seDeplacer(): void {
  //const url = 'http://1:8080/api/Harry/update/';
  const url = 'http://localhost:5200/api/Harry/update/';


  console.log(this.harry);
  // post body data 
  const response = {
    "Id_Harry" : this.harry.getId,
    "x_harry" : this.harry.getX(),
    "y_harry" : this.harry.getY(),
    "Pv_Harry" : this.harry.getPv(),
    "Force_Harry" : this.harry.getForce()
};
const httpOptions = {
  headers: new HttpHeaders({
    'Content-Type':  'application/json'
  })
  };

  this.http.post(url, response, httpOptions).toPromise().then((data:any) => {
    console.log(data);
    console.log(data.json.test);
    this.json = JSON.stringify(data.json);
  }); 
}

У меня ошибка, которая говорит:

**core.js:6014 ERROR TypeError: Cannot read property 'post' of undefined
    at GameComponent.seDeplacer (game.component.ts:215)
    at HTMLBodyElement.<anonymous> (game.component.ts:368)**

Функция seDeplacer () вызывается так:

catchKeyEvent(): void {
    var elem = document.body;
    elem.addEventListener("keyup", (event)=> {
      var x = this.harry.getX(),
          y = this.harry.getY();

       if( 0 <= x && x < this.maxX && 0 <= y && y < this.maxY ) 
       {
          switch(event.keyCode)
          {
            //=>
          case 39 :
                this.seDeplacer();
                this.harry.incX();

              break;
              //v
          case 40 :
              this.seDeplacer();
              this.harry.incY();

              break;
              //<=
          case 37 :
              this.seDeplacer();
              this.harry.decX();

              break;
          case 38 :
              this.seDeplacer();
              this.harry.decY();

              break;
          }
          this.move(x,y);


        }


  });

catchKeyEvent вызывается в init

 init(): void{

    this.getMap();
    this.getHarry();
    this.getMonsters();
    this.combat = 0;


    this.catchKeyEvent();
    this.catchClickEvent();
  }

проблема с этим .http.post. Обычно я объявляю приватное http: HttpClient;

Есть ли у вас какие-либо предложения? спасибо

Answer 1

Вы должны использовать внедрение зависимостей и внедрить HttpClient следующим образом:

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

export class GameComponent implements OnInit {

   constructor(private http: HttpClient)

   ...

}