Angular2 404 not Found bei URL: http://localhost/WebApi2/api/hero

Habe ich versucht, die http-Winkel-2 und Typoskript Beispiel auf https://angular.io/docs/ts/latest/tutorial/toh-pt6.html es funktioniert.
https://embed.plnkr.co/?show=preview

Aktualisierten code für die Verwendung externer Web-Api

private headers = new Headers({'Content-Type': 'application/json'});
//private heroesUrl = 'api/heroes';  //URL to web api
private heroesUrl = 'http://localhost/WebApi2/api/hero';  //URL to web api

constructor(private http: Http) { }

getHeroes(): Promise<Hero[]> {
   return this.http.get(this.heroesUrl)
               .toPromise()
               .then(response => response.json().data as Hero[])
               .catch(this.handleError);
}

Nun möchte ich ein update auf eine externe Web-Api2 und bekomme die Fehlermeldung unten.

EXCEPTION: Uncaught (Versprechen): Antwort mit status: 404 not Found bei URL: http://localhost/WebApi2/api/hero"
Ein Fehler ist aufgetreten Object { _body: Object, status: 404, "ok": false, statusText: "Nicht Gefunden", Header: Objekt-Typ: null, "url": "http://localhost/WebApi2/api/hero" }

Ich habe mir bei dieser Lösung, aber es funktioniert nicht für mich.
Angular2 http-get-Anfrage, die Ergebnisse in 404

Fehler beim import

import { Injectable }    from '@angular/core';
import { Headers, Http } from '@angular/http';
import { JSONP_PROVIDERS } from '@angular/http';

Http/Http/node_modules/@eckig/http/index"' hat keine exportiert Mitglied "JSONP_PROVIDERS'.

Kann jemand Punkt mich in richtige Richtung, Beispiel für den Aufruf von Web-Api2 von Angular2?

Die Ressource existiert nicht auf dem server. Also, entweder du verwendest die falsche URL, oder ist es ein server-Problem, hat nichts zu tun mit den Eckigen.
Die Plunker link, den Sie enthalten keinerlei code. Ein Update auf eine absolute Verknüpfung
Tut Winkel-2 selbst hat Versprechen Methoden, oder Sie versuchen, zu verwenden ES6 (Typoskript ) Versprechen?
Die Ressource existiert, ich habe es getestet in IIS.

InformationsquelleAutor mark s | 2017-02-18

  1. 9

    Ich personnaly kämpfte mit diesem für mehr als zwei Wochen vor landete ich auf einem post von @mp-loki -- Winkel-2 HTTP-GET-404 not Found bei URL - -- hier auf stackoverflow: Der Kredit daher wirklich geht zu ihm (oder Ihr, um sicher zu sein).

    Auf dem Winkel-setup-Seite (https://angular.io/docs/ts/latest/guide/setup.html), Sie werden begrüßt mit dem Satz: "Installieren Sie die Winkel-QuickStart Samen für eine schnellere, effizientere Entwicklung auf Ihrem Rechner."

    Werden Sie wahrscheinlich die Anweisungen befolgt auf, dass die setup Seite und das Projekt ist daher auf der Grundlage der Winkel-QuickStart Samen.

    Es ist nichts falsch mit, dass, nur, dass das tutorial gegeben durch Eckige verwendet eine in-memory-web-api -, und fängt alle Anfragen an einen anderen web-api, ob Sie eine direkte Aufruf der in-memory-web-api aus dem Projekt-code oder nicht.

    Anfragen stellen, um einer anderen web-api, daher müssen Sie sich trennen von der in-memory-web-api. Wie? Folgen Sie einfach die Schritten unten:

    1. In deinem Projekt root Verzeichnis, erweitern node_modules und löschen Sie die angular-in-memory-web-api Verzeichnis
    2. Noch in deinem Projekt root Verzeichnis, öffnen Sie die Paket.json - Datei und entfernen Sie die folgende Zeile aus der Liste der Abhängigkeiten: "angular-in-memory-web-api": "~0.2.4",
    3. In der src/app Verzeichnis, wenn Sie die folgenden Dateien beenden, oder alle Dateien im Zusammenhang mit in-memory, löschen Sie Sie: in-memory-data.service.ts, in-memory-data.service.js, und in-memory-data.service.js.map
    4. Öffnen src/app/app.- Modul.ts und entfernen Sie die folgenden aus der Liste der Importe: import { InMemoryWebApiModule } from 'angular-in-memory-web-api';, und import { InMemoryDataService } from './in-memory-data.service';
    5. Noch in src/app/app.- Modul.ts, entfernen Sie diese Zeile von code aus dem @NgModule Anmerkung: InMemoryWebApiModule.forRoot(InMemoryDataService),
    6. Zu diesem Zeitpunkt sollten Sie in der Lage sein, um die Anforderungen an Ihren web-api, aber wahrscheinlich ist das zurückgegebene Objekt nicht data Eigenschaft, so entfernen Sie es von Ihrem service-Datei: Ersetzen:
    getHeroes(): Promise<Hero[]> {
   return this.http.get(this.heroesUrl)
               .toPromise()
               .then(response => response.json().data as Hero[])
               .catch(this.handleError);
}

    mit 

    getHeroes(): Promise<Hero[]> {
   return this.http.get(this.heroesUrl)
               .toPromise()
               .then(response => response.json() as Hero[])
               .catch(this.handleError);
}

    Ich hoffe, das hilft.

    Dank mtchuente für Ihre Hilfe.
    Merci beaucoup, vous venez de mich sauvez-là !

    InformationsquelleAutor mtchuente

  2. 2

    Ich hatte das gleiche Problem, nach einigen frustrierenden Recherchen löste ich den 404-Fehler durch diese. Die Reihenfolge der Importe Angelegenheiten.

    Hoffe, es hilft jemand.

    omg danke!!! Hatte das exakt gleiche Problem. Sollten Sie wirklich aktualisieren der Dokumentation.

    InformationsquelleAutor esseara

Schreibe einen Kommentar