にSyntaxError：

Question

add-user.component.ts:30 SyntaxError: Unexpected token < in JSON at position 0 
    at Object.parse (<anonymous>) 
    at Response.webpackJsonp.../../../http/@angular/http.es5.js.Body.json (http.es5.js:797) 
    at MapSubscriber.project (user.service.ts:34) 
    at MapSubscriber.webpackJsonp.../../../../rxjs/operators/map.js.MapSubscriber._next (map.js:79) 
    at MapSubscriber.webpackJsonp.../../../../rxjs/Subscriber.js.Subscriber.next (Subscriber.js:90) 
    at XMLHttpRequest.onLoad (http.es5.js:1226) 
    at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421) 
    at Object.onInvokeTask (core.es5.js:3881) 
    at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:420) 
    at Zone.webpackJsonp.../../../../zone.js/dist/zone.js.Zone.runTask (zone.js:188) 

私は、このエラーが発生したフォームを追加したいの位置0でJSONに予期しないトークン<任意の誰かが知っている、なぜ

**add.components.ts** 

import { Component, OnInit } from '@angular/core'; 
import {UserService} from '../user.service'; 
import {Router} from '@angular/router'; 
import { User } from '../User'; 



@Component({ 
    selector: 'app-add-user', 
    templateUrl: './add-user.component.html', 
    styleUrls: ['./add-user.component.css'] 
}) 
export class AddUserComponent implements OnInit { 

user:User=new User(); 

errors=[]; 


    constructor(public userService:UserService, private router: Router) { } 


    ngOnInit() { 
    } 

    saveContact(){ 
    this.userService.saveContact(this.user) 
     .subscribe(
     data => console.log(data), 
     error => console.error(error) 
    ); 

     } 
     } 

フォーム

<form class="well"> 

    <div class="form-group"> 
    <label>username:</label> 
    <input type="text" class="form-control" placeholder="add username" [(ngModel)]="username" name="username" > 
    </div> 

    <div class="form-group"> 
    <label>Email:</label> 
    <input type="text" class="form-control" placeholder="add email" [(ngModel)]="email" name="email" > 
    </div> 



     <div *ngFor="let error of errors" class="alert alert-danger"> 
      <div>There is an error in :{{error.field}} field</div> 
      <div>{{error.message}}</div> 
     </div> 

    <button class="btn btn-primary" (click)="saveContact()" >Save</button> 

</form> 

User.service

@Injectable() 
export class UserService { 

    private uri= 'http://127.0.0.1:8000/api/users'; 


    constructor(private http: Http, private authenticationService: AuthService ) {} 


     getUsers(): Observable<any[]> { 
     const headers = new Headers({ 'Authorization': 'Bearer ' + this.authenticationService.token }); 
     return this.http.get(this.uri , {headers : headers}).map(res => <User[]> res.json()) 
     .catch(this.handelError); 

     } 



     saveContact(user: User) { 
     const headers = new Headers(); 
     headers.append('content-type', 'application/json'); 
     headers.append('Authorization', 'Bearer ' + this.authenticationService.token); 
     return this.http.post(this.uri, JSON.stringify(user), {headers : headers}) 
     .map(response => response.json()); 
     } 

Answer 1

問題はcontent-typeです。あなたはHTMLコンテンツを送信していませんが、コンテンツタイプにJSONというコンテンツがあります。あなたが応答を確認し、正確な1