Angulaire : ERREUR SyntaxError: Unexpected token < en JSON à la position 0

Salut j'ai besoin d'aide j'ai créé un angulaire de service, mais lorsque je veux afficher les données de mon fichier json, il m'indique cette erreur, j'ai essayé beaucoup d'échec de la solution

app.composante.ts

    import {Component, OnInit} from '@angular/core';
    import {Car} from './domain/car';
    import {CarService} from './service/carservice';

    @Component({
      selector: 'app-root',
      templateUrl: './app.component.html',
      styleUrls: ['./app.component.css'],
      providers: [CarService]
    })
    export class AppComponent implements OnInit {
      cars1: Car[];
      constructor(private carService: CarService) { }

      ngOnInit() {
       this.carService.getCarsSmall().subscribe(cars => this.cars1 = cars);
      }
    }

carservice.ts

@Injectable()
export class CarService {

  private jsonUrl = './cars-smalll.json';

  constructor(private http: Http) {}
    getCarsSmall(): Observable<Car[]> {
      return this.http.get(this.jsonUrl)
        .map(this.extractData)
        .catch(this.handleError);
    }

    private extractData(res: Response) {
      let body = res.json();
      return body.data || { };
    }
    private handleError (error: Response | any) {
      //In a real world app, you might use a remote logging infrastructure
      let errMsg: string;
      if (error instanceof Response) {
        const body = error.json() || '';
        const err = body.error || JSON.stringify(body);
        errMsg = `${error.status} - ${error.statusText || ''} ${err}`;
      } else {
        errMsg = error.message ? error.message : error.toString();
      }
      console.error(errMsg);
      return Observable.throw(errMsg);
    }
}

voitures-étroit.json

[
    {
      "brand": "VW",
      "year": 2012,
      "color": "Orange",
      "vin": "dsad231ff"
    },
    {
      "brand": "Audi",
      "year": 2011,
      "color": "Black",
      "vin": "gwregre345"
    },
    {
      "brand": "Renault",
      "year": 2005,
      "color": "Gray",
      "vin": "h354htr"
    }
]

vous en remercie d'avance.

  • Cette erreur est presque toujours causée par un problème de configuration du serveur, et non pas par angulaire à tous. Le serveur est l'envoi d'un document HTML à la place de l'un de vos fichiers javascript. Ce serveur, utilisez-vous ici, et qu'est-ce que votre serveur de configuration de routage ressembler?
  • ou pour se moquer de JSON chemin d'accès est incorrect, ce que vous voyez dans le navigateur du journal de Réseau?
  • Grâce Claies pour votre réponse, donc dans mon cas je veux utiliser un fichier json qui stockent dans la même structure (src / app / data / voitures-étroit.json)
  • Ajouter un fichier Json en vertu de l'actif et ensuite l'exécuter
  • j'ai essayer de mettre de json dans le dossier des ressources, et j'ai changer de chemin de json pour (/src/app/assets/voitures-étroit.json) mais j'obtiens le même message d'erreur
  • Je suis désolé, je ne suis pas sûr de savoir comment beaucoup plus d'aide que je peux être. Essayez de poster sur Angulaire 2+ à reddit. Il y a vraiment des gens utiles là-bas.

InformationsquelleAutor Anas | 2017-05-25