отладка машинописного текста при вызове веб-API от углового

Question

Я очень новый в угловой.Я пытаюсь вызвать мой метод веб-API от angular.Я получаю сообщение о загрузке ... в моем браузере, когда я выполняю запрос http.get.Я предполагаю, что в http.get есть ошибка. Ниже приведен мой код

 getProjectDetails() {

    return this._http.get(this.myAppUrl + 'api/AllItProjectsLists/Index').pipe(map(
      response => {
        return response;
      }));

  }

Я пытался перехватить ошибку, реализовав обработчик ошибок в angular

 private handleError(operation: String) {
    return (err: any) => {
      let errMsg = `error in ${operation}() retrieving ${this.myAppUrl}`;
      console.log(`${errMsg}:`, err)
      if (err instanceof HttpErrorResponse) {
        // you could extract more info about the error if you want, e.g.:
        console.log(`status: ${err.status}, ${err.statusText}`);
        // errMsg = ...
      }
      return Observable.throw(errMsg);
    }
  }

, но не уверен, как его реализовать.это в моем методе getProjectDetails ()

Ниже приведен весь мой код:

import { Injectable, Inject } from '@angular/core';
import { HttpClient, HttpInterceptor, HttpErrorResponse } from '@angular/common/http';
import { map } from 'rxjs/operators';
import { AllItProject } from '../../models/allitproject';
import { Observable } from 'rxjs';
import { catchError, tap } from 'rxjs/operators';



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

  myAppUrl = '';

  constructor(private _http: HttpClient, @Inject('BASE_URL') baseUrl: string) {
    this.myAppUrl = baseUrl;
  }

  private handleError(operation: String) {
    return (err: any) => {
      let errMsg = `error in ${operation}() retrieving ${this.myAppUrl}`;
      console.log(`${errMsg}:`, err)
      if (err instanceof HttpErrorResponse) {
        // you could extract more info about the error if you want, e.g.:
        console.log(`status: ${err.status}, ${err.statusText}`);
        // errMsg = ...
      }
      return Observable.throw(errMsg);
    }
  }


  getProjectDetails() {

    return this._http.get(this.myAppUrl + 'api/AllItProjectsLists/Index').pipe(map(
      response => {
        return response;
      }));

  }

Ошибка появляется где-то, когда я делаю http.get.Когда я открываю инструменты разработчика в браузере, я вижу ошибку:

"Http error response для https://localhost:44313/api/AllItProjectsLists/Index: 500 OK".

Ниже приведен метод моего контроллера, который я используюпытаясь позвонить

namespace ProjectDetails.Controllers
{
    [Route("api/[controller]")]
    [ApiController]
    public class AllItProjectsListsController : ControllerBase
    {
        private readonly KPIContext _context;
        private readonly IProject objProject;

        public AllItProjectsListsController(IProject _objProject)
        {
            objProject = _objProject;

        }


        [HttpGet("Index")]
        public IEnumerable<AllItProjectsList> Index()
        {
            return objProject.GetAllProjectDetails();
        }

любая помощь будет высоко оценена.

Answer 1

Если вы хотите увидеть свою ошибку, вы можете использовать catchError, чтобы перехватить ее, измените ваш сервис следующим образом:

import { Injectable, Inject } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Observable } from 'rxjs';
import { tap, catchError } from 'rxjs/operators';

@Injectable()
export class ProjectDetailService {

  myAppUrl = '';

  constructor(private _http: HttpClient, @Inject('BASE_URL') baseUrl: string) {
    this.myAppUrl = baseUrl;
  }

  getProjectDetails() {
    return this._http.get(this.myAppUrl + 'api/AllItProjectsLists/Index', this.setHttpHeader())
      .pipe(
        tap(data => console.log("Anlagenstatus Daten:", data)),
        catchError(this.handleError),
      )
  }

  private setHttpHeader() {
    const headers = new HttpHeaders().set('Accept', 'application/json').set('Content-Type', 'application/json');
    let options = { headers: headers };
    return options;
  }

  private handleError(error: Response): Observable<any> {
    console.error("observable error: ", error);
    return Observable.throw(error.statusText);
  }

}

Теперь вы можете увидеть свою ошибку в браузере-> вкладка консоли

Если вы получили ошибку с кодом состояния 500: это означает, что на вашем сервере произошла ошибка (проверьте ваш API)

Answer 2

Если вы получаете внутренний сервер, это означает, что httpclient angular может подключиться к серверу, но из-за некоторой проблемы в коде вашего сервера ... Сервер дает 500 Внутренняя ошибка сервера ...

Я бы предложил вампроверьте свой API, используя POST man tool ... Он поможет вам очистить погоду, если это проблема кода на стороне сервера или угловая сторона ...

Кроме того, используйте Angular "наблюдаемые" и "Подписаться", которые помогут вам получитьэто исправление быстро.

    /** GET heroes from the server */
getHeroes (): Observable<Hero[]> {
  return this.http.get<Hero[]>(this.heroesUrl)
}

Для получения более подробной информации, пожалуйста, перейдите по ссылке ниже

https://angular.io/tutorial/toh-pt6

Дайте мне знать, если вы все еще сталкиваетесь с той же проблемой ...

Answer 3

1. Зарегистрированы ли эти инъекции на уровне конструктора где-нибудь, или вы просто вводите инъекцию без какого-либо инструмента регистрации ... как autofac, ninject и т. Д.

2. Удалите маршрутизацию и всеиз метода API или создайте простой метод get без каких-либо параметров, а затем нажмите API из POSTMAN.

Надеюсь, на этот раз вы обязательно получите свое решение ...