Question

我的意图是对后端服务进行REST调用。在初始页面加载中，呼叫将输入失败lambda。浏览器网络部分指示未进行任何服务调用。如果刷新页面，它将发出呼叫。

我无法显示完整的消息来源，但这是我下面的部分内容。首次加载页面时，控制台日志消息按顺序排列：

@@BP1
@@BP3

我尝试在中心摘要服务之前在hub.service中调用其他服务，它按预期工作。

需要明确的是，如果框架实际上进行了HTTP REST调用，但我没有理解，我会理解遇到错误。相反，该错误类似于“ TypeError：值为空”

homepage-hub-summary-tile-component.ts：

import { Component, OnInit, Input } from '@angular/core';
import { Hub } from '../../../hub.service';
import { ReportService } from '../../../report.service';
import { HubSummaryTileData, LoadStatus } from '../../../model/hub.summary.tile.data'
@Component({
  selector: 'app-homepage-hub-summary-tile',
  templateUrl: './homepage-hub-summary-tile.component.html',
  styleUrls: ['./homepage-hub-summary-tile.component.css']
})
export class HomepageHubSummaryTileComponent implements OnInit {
  LoadStatusType = LoadStatus;
  tileLoadStatus: LoadStatus = LoadStatus.STARTING;
  constructor(private hubService: HubService,private reportService : ReportService) {
      //this.popupHomeFilterSelection = this.reportService.getPopupHomeFilterSelection();
      this.popupHomeFilterSelection = false;
  }

  ngOnInit() {
    this.getSummaryTileData();

  }

  getSummaryTileData() {
    this.tileLoadStatus = LoadStatus.LOADING;
    this.hubService.getHubSummaryTileData()
      .subscribe((data ) =>
        {
          console.log('@@BP1');
          if(data ) {
            this.summaryTileData = data as unknown as HubSummaryTileData;
            this.tileLoadStatus = LoadStatus.SUCCESS;
            console.log('@@BP2');
          } else {
            this.tileLoadStatus = LoadStatus.ERROR;
            console.error('Error in data received from hub summary tile data');
            console.log('@@BP3');
          }
        },
        (error) => {
          console.log("@BP5");
          this.tileLoadStatus = LoadStatus.ERROR;
          console.log('Error fetching hub portfolio summary tile data: '+error)
        }
      );
      console.log("@BP6");


  }

}

hub.service.ts

import {
  HttpClient,
  HttpHeaders,
  HttpEvent
} from '@angular/common/http';
import {
  Injectable,
  EventEmitter
} from '@angular/core';
import { BehaviorSubject, Observable } from 'rxjs';
import {
  AppConstant
} from './constants/app-constants';
import {
  Subscription
} from 'rxjs/internal/Subscription';
import { UUID } from 'angular2-uuid';

import { HubSummaryTileData } from './model/hub.summary.tile.data';

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

  constructor(private http: HttpClient) {
  }

  private httpOptions : any = {
      headers: new HttpHeaders()
      .set('Accept-Encoding', 'application/json; charset=UTF-8')
      .set('Content-Type', 'application/json; charset=UTF-8')
      .set('AUTH_USER', sessionStorage.getItem("authUser"))
      .set('ROLE_ID', sessionStorage.getItem("userRoleId"))
      .set('SC_TRACE_ID',UUID.UUID())

  };

  public getHubSummaryTileData() {
    return this.http.get<HubSummaryTileData>(AppConstant.URL_GET_HUB_SUMMARY_TILE_DATA,
      this.httpOptions);
  }
}

如果您读得很远，请Woodsman谢谢您。

Angular Rest调用立即失败，但不进行调用

0 个答案: