[英]Angular 2 - Getting object id from array and displaying data
我目前有一项服务,可从显示线索列表的json文件中获取json对象数组。 每个销售线索都有一个ID,当单击此列表中的销售线索时,会将用户带到在URL中具有此ID的视图,即(/ lead / 156af71250a941ccbdd65f73e5af2e67)
我一直在尝试通过潜在顾客服务通过id获取此对象,但无法使其正常工作。 我要去哪里错了?
另外,我在HTML中使用两种方式绑定。
服务
leads;
constructor(private http: HttpClient) { }
getAllLeads() {
return this.http.get('../../assets/leads.json').map((response) => response);
}
getLead(id: any) {
const leads = this.getAllLeads();
const lead = this.leads.find(order => order.id === id);
return lead;
}
零件
lead = {};
constructor(
private leadService: LeadService,
private route: ActivatedRoute) {
const id = this.route.snapshot.paramMap.get('id');
if (id) { this.leadService.getLead(id).take(1).subscribe(lead => this.lead = lead); }
}
JSON格式
[
{
"LeadId": "156af71250a941ccbdd65f73e5af2e66",
"LeadTime": "2016-03-04T10:53:05+00:00",
"SourceUserName": "Fred Dibnah",
"LeadNumber": "1603041053",
},
{
"LeadId": "156af71250a999ccbdd65f73e5af2e67",
"LeadTime": "2016-03-04T10:53:05+00:00",
"SourceUserName": "Harry Dibnah",
"LeadNumber": "1603021053",
},
{
"LeadId": "156af71250a999ccbdd65f73e5af2e68",
"LeadTime": "2016-03-04T10:53:05+00:00",
"SourceUserName": "John Doe",
"LeadNumber": "1603021053",
}
]
你没有使用新创建的leads
阵列( const leads
不this.leads
),所以这样做:
getLead(id: any) {
return this.getAllLeads().find(order => order.LeadId === id);
}
并将map
更改为flatMap
,因为从服务器获得了一个数组,但必须将其转换为其项的流:
getAllLeads() {
return this.http.get('../../assets/leads.json').flatMap(data => data);
}
如果需要,不要忘记导入它: import 'rxjs/add/operator/flatMap';
您可以在组件级别本身中使用getLead,因为您没有制作任何API来获取信息。 在您的组件中
this.lead = this.leads.find(order => order.id === id);
或使上述服务有效,只做leads
而不是this.leads
const lead = leads.find(order => order.id === id);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.