Ich portiere eine Reihe von Bildern, die ich lokal gespeichert habe, zu einer Online-Ressource, die immer auf dem neuesten Stand ist. Ursprünglich, wenn ich die Bilder lokal speicherte, konnte ich folgende Bedingung für meine Bilder verwenden:
%Vor% Dies würde den aktuellen Bildpfad basierend auf einem Namen aufnehmen, und wenn er nicht existierte, würde er einfach den Bildpfad von /Content/champions/None.png
Ich dachte, das würde über eine URL genauso funktionieren. Also habe ich die Syntax gemacht.
%Vor% Was ich annehmen würde, ist, dass, wenn die obige URL 404 (Not Found) zurückgibt, sie für das Bild None zurück auf meinen lokalen Speicher wird. Es versucht jedoch immer noch, ein Online-Bild anzuzeigen und zeigt das "gebrochene Bild / Bild" -Symbol an, anstatt über das zu meinem lokalen "Kein" -Bild zu konditionieren.
Wie könnte ich das beheben? Oder warum reagiert Angular nicht richtig auf dieses Szenario, wenn es nicht gefunden 404 (Not Found) ?
Manchmal versucht es, die bedingte Syntax der URL hinzuzufügen, anstatt sie im Home-Verzeichnis nachzusehen, könnte das das Problem sein? d. h. Es wird manchmal Folgendes zurückgegeben, anstatt von meinem Inhaltsordner aus neu zu starten. http://ddragon.leagueoflegends.com/cdn/4.20.1/img/champion//Content/champions/None.png
Diese Konstruktion würde Ihren Bildnamen nur dann durch 'None' ersetzen, wenn Ihr Bild null oder nicht definiert ist.
Die Angular-Direktive ngSrc hat keine nativen Funktionen zur Verarbeitung von 404-Response.
Aber es wäre mit der folgenden onErrorSrc -Richtlinie behoben.
Siehe Beispiel auf JSFiddle
Eine andere einfache Lösung ist der folgende Code, der das gleiche Endergebnis liefert:
%Vor%Ich habe das benutzt:
%Vor%imgError () und imgLoaded () sind Funktionen im Controller für diese Seite. Diese Technik ist besonders für meine Zwecke geeignet, weil ich darin eine Bereichsvariable setze, um das Bild vollständig auszublenden, wenn es nicht geladen ist, und es durch eine internationalisierte Textnachricht über die Tatsache zu ersetzen, dass das Bild nicht gefunden wird.
Tags und Links javascript angularjs image