我使用角度cli配置了角度项目。项目正在加载,但当我点击链接列出预订时,我收到一些错误。我在角度快速入门项目结果中配置的相同文件正在获取。请帮帮我,我不知道如何调试这个?
GET http://localhost:4200/null 404 (Not Found)
scheduleTask @ zone.js:2263
webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:410
onScheduleTask @ zone.js:300
webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:404
webpackJsonp.../../../../zone.js/dist/zone.js.Zone.scheduleTask @ zone.js:235
webpackJsonp.../../../../zone.js/dist/zone.js.Zone.scheduleMacroTask @ zone.js:258
(anonymous) @ zone.js:2287
proto.(anonymous function) @ zone.js:1426
(anonymous) @ http.es5.js:1278
webpackJsonp.../../../../rxjs/Observable.js.Observable._trySubscribe @ Observable.js:57
webpackJsonp.../../../../rxjs/Observable.js.Observable.subscribe @ Observable.js:45
webpackJsonp.../../../../rxjs/operator/map.js.MapOperator.call @ map.js:54
webpackJsonp.../../../../rxjs/Observable.js.Observable.subscribe @ Observable.js:42
webpackJsonp.../../../../rxjs/operator/catch.js.CatchOperator.call @ catch.js:79
booking.service.ts
import { Injectable } from '@angular/core';
import { Headers, Http, Response } from '@angular/http';
import { Bookings } from './booking';
import 'rxjs/add/operator/toPromise';
import 'rxjs/add/operator/map';
import 'rxjs/Rx';
import { Observable } from 'rxjs/Observable';
@Injectable()
export class BookingService {
private headers = new Headers({'Content-Type': 'application/json'});
private _url: 'apidata/testData.json';
constructor(private http: Http) { }
getBooking(): Observable<any> {
return this.http.get(this._url)
.map((response: Response) => response.json().bookingDetails.data as Bookings[])
.catch(this.handleError);
}
private handleError(error: any): Promise<any> {
console.error('An error occurred', error); // for demo purposes only
return Promise.reject(error.message || error);
}
}
booking.component.ts
import { Component, OnInit } from '@angular/core';
import { BookingService } from './booking.service';
import { Bookings } from './booking';
/*declare var $;*/
@Component({
selector: 'app-booking',
templateUrl: './booking.component.html',
styleUrls: ['./booking.component.css']
})
export class BookingComponent implements OnInit {
bookings: Bookings[];
constructor(private employeeService: BookingService) { }
getBooking(): void {
/*this.employeeService.getEmployee().then(employees => this.employees = employees);*/
this.employeeService.getBooking().subscribe(bookings => this.bookings = bookings);
}
ngOnInit(): void {
this.getBooking();
}
}
ApiData / testData.json
{
"bookingDetails": {
"data": [
{"_id": "57ee4e32f8f888dc11000029", "invoice_number": "12345", "cabinname": "Cabin1", "checkin_from": "2016-11-05", "reserve_to": "2016-11-06", "usrEmail": "cabin1@gmail.com", "txid": "123", "status": "1", "payment_status": "1", "beds": "3", "dormitory": "2", "payment_type": "sofort", "total_prepayment_amount": "12"},
{"_id": "57ee4e32f8f888dc11000030", "invoice_number": "123456", "cabinname": "Cabin2", "checkin_from": "2016-11-06", "reserve_to": "2016-11-07", "usrEmail": "cabin2@gmail.com", "txid": "12345", "status": "1", "payment_status": "1", "beds": "3", "dormitory": "2", "payment_type": "sofort", "total_prepayment_amount": "12"},
{"_id": "57ee4e32f8f888dc11000031", "invoice_number": "1234567", "cabinname": "Cabin3", "checkin_from": "2016-11-07", "reserve_to": "2016-11-08", "usrEmail": "cabin3@gmail.com", "txid": "123456", "status": "1", "payment_status": "1", "beds": "3", "dormitory": "2", "payment_type": "sofort", "total_prepayment_amount": "12"},
{"_id": "57ee4e32f8f888dc11000032", "invoice_number": "1234568", "cabinname": "Cabin4", "checkin_from": "2016-11-08", "reserve_to": "2016-11-09", "usrEmail": "cabin4@gmail.com", "txid": "123457", "status": "1", "payment_status": "1", "beds": "3", "dormitory": "2", "payment_type": "sofort", "total_prepayment_amount": "12"},
{"_id": "57ee4e32f8f888dc11000033", "invoice_number": "1234569", "cabinname": "Cabin5", "checkin_from": "2016-11-09", "reserve_to": "2016-11-10", "usrEmail": "cabin5@gmail.com", "txid": "123458", "status": "1", "payment_status": "1", "beds": "3", "dormitory": "2", "payment_type": "sofort", "total_prepayment_amount": "12"}
]
}
}