从Web服务器填充ngFor表时出错

我尝试从web服务器获取数据,并用 ngFor .

这是我用的桌子 ngFor公司 :

<div class="applic-liste">
  <table class="table table-striped table-hover table-bordered">
    <tbody>
      <tr *ngFor="let application of applications">
        <td>{{application.id}}</td>
        <td>{{application.name}}</td>
        <td>{{application.version}}</td>
        <td>{{application.fromTo}}</td>
        <td>{{application.description}}</td>
        <td>{{application.geography}}</td>
      </tr>
</tbody>
  </table> 
  </div>

我在这个类中获取数据:

import { Component, OnInit, ViewEncapsulation } from '@angular/core';
import { DbService } from '../../db.service.service';
import {Application} from '../application.component';

@Component({
  selector: 'app-applic-list',
  templateUrl: './applic-list.component.html',
  styleUrls: ['./applic-list.component.css'],
  providers: [DbService],
  encapsulation: ViewEncapsulation.None
})
export class ApplicListComponent implements OnInit {

  constructor(private _dbService:DbService) { }
  applications:any;  
  ngOnInit() {
    this.getData();
  }

  getData(){
    this._dbService
       .getData()
       .subscribe(applications => {
         this.applications = applications;
     } )
 }

}

这是我的 service 连接到web服务器的位置:

@Injectable()
export class DbService {
  applications=[];
  private _serverUrl: string = "http://localhost/api/";
  constructor(private _http:Http) { }

 getData(){
    return this._http.get(this._serverUrl+'select.php').
    map((response:Response) => response.json);
  }
}

我还在本文中定义了我的应用程序阵列 class :

export class Application implements OnInit {

  constructor() { }
  name: string;
  version: string;
  fromTo: string;
  description: string;
  geography: string;
  ngOnInit() {
  }

}

这些是 错误 我得到:

有人能帮我做这个吗。我不熟悉棱角。。我不知道问题出在哪里

我感谢你的回答!

编辑: 这是我的json响应: [{"id":"1","name":"TestName","version":"1.2","fromTo":"Test","description":"Beschreibung","geography":"Geography"}]