Ng-lazyload-image: TypeError: Die Eigenschaft 'toLowerCase' von undefined kann nicht gelesen werden, wenn die Seite von der Mitte vs. von oben geladen wird

Hi,

Ich kann das nicht reproduzieren :/
Wenn Sie sagen "Laden Sie Ihre Testseite wie gewohnt". Meinst du diese Seite: https://tjoskar.github.io/ng-lazyload-image oder betreibst du die Seite lokal mit npm start ?

Welchen Browser verwendest du?

Aus irgendeinem Grund kann ich auf github.io die Seite nicht aktualisieren, nachdem ich sie einmal geladen habe. Es sagt 404 nicht jedes Mal gefunden :(

Aber im Allgemeinen meine ich lokal mit jedem Projekt - ich verwende Angular 4 mit Universal und Node (also könnte Universal etwas damit zu tun haben). Verwenden von Chrome 59 für Windows 10. Ich denke, dies könnte ein Fehler mit der neuen onLoad-Funktion sein, aber nicht positiv. Der Fehler tritt nur in der Node-Konsole auf, in der Chrome-Konsole scheinen keine Fehler aufzutreten.

Hallo @elitenick ,
Können Sie einen vollständigen Stack-Trace des Fehlers geben?

@tjoskar
Ich denke, dass der Fehler mit https://github.com/tjoskar/ng-lazyload-image/blob/master/src/lazyload-image.ts#L75 zusammenhängt , bevor hier Fehler auftreten, aber da nicht.
In Angular Universal hier https://github.com/tjoskar/ng-lazyload-image/blob/master/src/lazyload-image.ts#L47 Fehler erzeugen, weil element im Server nicht definiert ist.
Ich denke, eine ziemlich gute Lösung des Problems besteht darin, lazy img auf der Serverseite zu deaktivieren.

Aus irgendeinem Grund kann ich auf github.io die Seite nicht aktualisieren, nachdem ich sie einmal geladen habe. Es sagt 404 nicht jedes Mal gefunden :(

Ja, das liegt daran, dass github nicht unterstützt, alle Anfragen an index.html umzuleiten (aber das ist ein völlig anderes Problem)

Es hat wahrscheinlich etwas mit Angular Universal zu tun, aber es gibt ein paar Dinge, die ich nicht verstehe:

1. Warum wird der Fehler nur beim Aktualisieren der Seite angezeigt? Node sollte keine Informationen über die Scroll-Position erhalten oder ob es Ihr erster oder zweiter Besuch ist (das Backend sollte keinen solchen Status haben).
2. Nehmen wir an, es ist diese Zeile , die das Problem verursacht. Wenn ja, kann element nicht undefiniert sein, da wir fehlerfrei von element auf nodeName zugreifen und außerdem element in isVisible() verwenden. und wir verwenden sogar window in dieser Funktion, die in einem Serverkontext undefiniert sein sollte.

Ich denke, dies könnte ein Fehler mit der neuen onLoad-Funktionalität sein, aber nicht positiv

Verwenden Sie (onLoad) ? Können Sie versuchen, es zu entfernen und sehen, ob Sie den Fehler reproduzieren können?

@rimlin

Ich denke, eine ziemlich gute Lösung des Problems besteht darin, lazy img auf der Serverseite zu deaktivieren.

Ja, es macht keinen Sinn, Bilder auf den Server zu laden (da wir nichts über die Bildschirmgröße wissen).
Vielleicht können wir einfach if (isPlatformServer(this.platformId)) return; ( ref ) in ngAfterContentInit hinzufügen.

https://github.com/tjoskar/ng-lazyload-image/pull/179

@elitenick , ich habe gerade [email protected] mit @rimlin Pull-Request veröffentlicht. Können Sie es installieren ( npm install [email protected] ) und sehen, ob es das Problem behebt?

Mit Sicherheit! Werde es heute überprüfen und berichten! Danke Leute.

Es ist repariert! Danke vielmals!! Mein gleiches Szenario mehrmals neu erstellt und keine Knotenfehler mehr. Und das Lazy Loading funktioniert weiter, sobald Angular einsetzt.

Enthalten in [email protected] .