2016-12-28 9 views
1

フェッチして角型データテーブルに配置するデータがデータベースに格納されていますが、それがうまくいかず、その理由が見つかりません。しかし、コンストラクタで作成したインスタンスは私の角度テーブルに表示されますが、データベースの格納データを角度データテーブルに要求できるようにしたいと考えています。ありがとう!データベースから角度データテーブルにデータを取得する

customer.tsはファイル

import {Component, OnInit} from '@angular/core'; 
import {HttpService} from "./Client_Service"; 
import {Response} from '@angular/http'; 

@Component({ 
    selector: 'client', 
    templateUrl:'client_table.html', 
    providers:[HttpService] 


}) 

    export class ClientComponent{ 

    welcome: string; 
    clients: [{ 
    Name: string, 
    Email: string, 
    Company: string 

    }]; 

    constructor(){ 
    this.welcome = "Customer Listing" 
    this.clients = [{ 
     Name: "John Jan", 
     Email:"example.com", 
     Company: "Metabo" 
    } 

    ] 

    }; 



    customers:Customer[]; 

    constructor(private httpService: HttpService){} 

    ngOnInit(){ 


    this.httpService.getCustomer() 
     .subscribe(
     (data: Response) => console.log(data.json()) 
    ); 

    } 




} 

//マイ角度のDataTable

<h1>{{welcome}}</h1> 
<table class="table"> 

    <tr> 
    <th>#</th> 
    <th> Name</th> 
    <th>Email</th> 
    <th>Company</th> 



</tr> 
    <tr *ngFor="let client of clients; let i = index"> 
     <td>{{i + 1}}</td> 
     <td>{{client.Name}}</td> 
     <td>{{client.Email}}</td> 
     <td>{{client.Company}}</td> 

    </tr> 


</table> 

// HTTPサービスの

import {Injectable} from '@angular/core'; 
import {Response, Http} from '@angular/http'; 
    import {DataListModule} from 'primeng/primeng'; 


@Injectable() 

export class HttpService{ 

    constructor(private http:Http){ 

    } 

    getCustomer(){ 
    //using get request 
    return this.http.get('http://localhost:9000/api/crm_api/v1/customers') 
     .map((response: Response) => response.json()) 



    } 





} 

答えて

3

this.httpService.getCustomer() 
     .subscribe(
     (data: Response) => console.log(data.json()) 
    ); 
た場合

働いている、あなたがしなければならないすべては、次のとおりです。

this.httpService.getCustomer() 
     .subscribe(
     (data: Response) => { 
      console.log(data.json()) 
      this.clients = data; 
     } 
    ); 
+0

私はこのエラーを得続ける:タイプ[{first_nameの「レスポンス型に代入できません」:文字列;最後の_name:文字列... – Switz

+0

'Response'を削除して、タイプインタフェースを与えるか、単に次のようにします:'(data:any)=> ''(data:Response)=> {' – echonax

+0

..iコンソールのレスポンスが表示されます。テーブルにそれらを表示する方法もチェックします。ありがとうございました – Switz

関連する問題