在angular2 cli中配置项目时如何解决?

时间:2017-06-12 11:54:41

标签: angular

我使用角度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"}
    ]
  }
}

0 个答案:

没有答案