无法在Angular 4中显示单个JSON对象属性

请，我需要帮助来显示单个JSON对象属性 .

这是我的服务：

import {  
    Injectable  
} from '@angular/core';  
import {  
    Http,  
    HttpModule,
    Headers,  
    RequestOptions,  
    Response  
} from '@angular/http'; 
import { HttpClientModule } from '@angular/common/http'; 
import {  
    Observable 

} from 'rxjs/Rx';  
import 'rxjs/Rx'; //get everything from Rx    
import 'rxjs/add/operator/toPromise';  
import {  
    IProduct  
} from "../models/iproduct"; 
@Injectable()  
export class ProcessJsonService {  
    constructor(private http: Http) {}  
    //    
    getProcesslist() {  
        return this.http.request('http://www.json-generator.com/api/json/get/bVOdrzTUeq?indent=0')
   .map(res => { console.log("I SEE DATA HERE: ", res.json())
       return res.json(); })

        }

    }

我的component.ts文件：

import { Component, OnInit } from '@angular/core';
import { IProduct } from "../models/iproduct";
import {  
  Http  
} from '@angular/http';   
import {  
  ProcessJsonService  
} from '../models/myjsonprocess';  
import {  
  Observable  
} from 'rxjs/Rx'; 
@Component({
  selector: 'app-product-list',
  templateUrl: './product-list.component.html',
  styleUrls: ['./product-list.component.css']
})
export class ProductListComponent implements OnInit {

  pageTitle: string = 'Process List';
  imageWidth: number = 50;
  imageMargin: number = 2;
  showImage: boolean = false;
  listFilter: string = '';
  processList: IProduct[];  
  errorMessage: string;

  constructor(private _processJsonService: ProcessJsonService) {  
    this.processList = []; 
  }

  ngOnInit(): void {  
        this._processJsonService.getProcesslist()
        .subscribe(
        processList => this.processList = processList)
    } 
}

我的HTML代码：

<div class='panel panel-primary'>
  <div class='panel-heading'>
    {{pageTitle}}
  </div>
  <div class='panel-body'>
    <div class='row'>
      <div class='col-md-2'>Filter by:</div>
      <div class='col-md-4'>
        <input type='text' [(ngModel)]='listFilter' />
      </div>
    </div>
    <div class='row'>
      <div class='col-md-4'>
        <h4>Filtered by: {{listFilter}} </h4>
      </div>
    </div>
        <div class='table-responsive'>
            <table class='table'
                   *ngIf='processList && processList.length'>
                <thead>
                    <tr>
                        <th>Process Name</th>
                        <th>Process Instance</th>
                        <th>Process Status</th>
                        <th>Temp-acked Messages Number</th>
                        <th>Unprocessed Messages Number</th>
                        <th>Deferred Messages Number</th>
                    </tr>
                </thead>
                <tbody>
                    <tr *ngFor="let process of processlist | processFilter:listFilter" >
                        <td>{{ process.process_name }}</td>
                        <td>{{ process.instance  }}</td>
                        <td>{{ process.status }}</td>
                        <td>{{ process.tempacked_cmsg}}</td>
                        <td>{{ process.unprocessed_cmsg}}</td>
                        <td>{{ process.deferred_cmsg}}</td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
</div>

问题是我没有在浏览器上显示我的数据，但是如果URL包含JSON数组，则数据会显示在浏览器中 .

我在服务中添加了一个console.log来在控制台中显示res.json，我得到了它 . 我在组件中尝试了相同的（在ngOnInit中），但我没有在控制台中获取数据 . 这可能有助于找出问题所在 .

有什么帮助吗？