[英]Fetching data from database into angular datatable
I have some data stored in my database which i want to fetch and place in my angular datatable, but it doesn't work out and i can't find the reason why. 我有一些数据存储在数据库中,我想将其提取并放置在我的角度数据表中,但是它无法解决问题,我也找不到原因。 Although, the instances i create in the constructor show up in my angular table, but i want to be able to request the stored data in my database into my angular datatable. 虽然,我在构造函数中创建的实例显示在我的角度表中,但是我希望能够将数据库中存储的数据请求到我的角度数据表中。 Thanks! 谢谢!
customer.ts file 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())
);
}
}
// My angular 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 service // 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())
}
}
If 如果
this.httpService.getCustomer()
.subscribe(
(data: Response ) => console.log(data.json())
);
is working, all you have to do is: 正在工作,您所要做的就是:
this.httpService.getCustomer()
.subscribe(
(data: Response ) => {
console.log(data.json())
this.clients = data;
}
);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.