Отображение JSON API Дженкинса в ANGULAR 5 - PullRequest
Новая
       9

Отображение JSON API Дженкинса в ANGULAR 5

0 голосов
/ 03 мая 2018

Используя JSON API Дженкинса, я правильно получаю следующий результат JSON: 

{"_class":"hudson.model.FreeStyleBuild","estimatedDuration":50136,"fullDisplayName":"JazzClub #26","result":"SUCCESS","timestamp":1524823606642}

Чтобы отобразить результат в Dashboard с помощью хорошо работающего приложения Angular 5, я попытался:

МОДЕЛЬ 

export interface JenkinsBuild {
  _class: string;
  estimatedDuration: number;
  fullDisplayName: string;
  result: string;
  timestamp: number;
}

Услуги 

    import {Injectable} from '@angular/core';
import {HttpClient, HttpHeaders} from '@angular/common/http';
import {AppComponent} from '../app.component';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';
import {Observable} from 'rxjs/Observable';
import {JenkinsBuild} from '../Model/jenkinsBuild';


@Injectable()
export class JenkinsService {

  constructor(private http: HttpClient) {
  }

  getLastBuildInfos(): Observable<JenkinsBuild> {
    return this.http.get<JenkinsBuild>(AppComponent.Jenkins_API_URL +
      '/lastBuild/api/json?tree=result,timestamp,estimatedDuration,fullDisplayName,building');
  }


}

Компонент панели приборов 

import {Component, OnInit} from '@angular/core';
import {JenkinsService} from '../Service/jenkinsService';
import {JenkinsBuild} from '../Model/jenkinsBuild';
import {Observable} from 'rxjs/Observable';

@Component({
  selector: 'app-jenkins',
  templateUrl: './jenkins.component.html',
  styleUrls: ['./jenkins.component.css']
})
export class JenkinsComponent implements OnInit {
  jenkinsDataStringified: any;
  jenkinsData: JenkinsBuild;

  constructor(public jenkinsService: JenkinsService) {
  }

  ngOnInit() {
    this.jenkinsService.getLastBuildInfos().subscribe((data:JenkinsBuild) => {
      this.jenkinsData = data ;
    });
  }
}

Простой тест отображения HTML 

<p>{{jenkinsData.result}}</p>
<p>{{jenkinsData.fullDisplayName}}</p>

Я пытался исправить проблемы с отображением на ответы отсюда Тип задания вопроса

Но я все еще получаю ошибку консоли браузера: ОШИБКА TypeError: Невозможно прочитать свойство 'result' undefined.

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

1 Ответ

0 голосов
/ 03 мая 2018

Используйте оператор безопасной навигации (обратите внимание на ? после jenkinsData) - Документы 

<p>{{jenkinsData?.result}}</p>
<p>{{jenkinsData?.fullDisplayName}}</p>

Это необходимо, потому что ваш HTML загружается до того, как вернется вызванный асинхронный вызов, что означает, что jenkinsData не определено до тех пор, пока не вернется эта функция.

...