Kennt jemand im neuen Angular2- Framework den richtigen Weg, um einen Schwebeflug wie ein Ereignis auszuführen ?
In Angular1 gab es ng-Mouseover
, aber das scheint nicht übertragen worden zu sein.
Ich habe die Dokumente durchgesehen und nichts gefunden.
javascript
angular
events
hover
Ronin
quelle
quelle
mousemove
Event kann auch hier helfen. SIEHE DIESE SEITE ZUM BEISPIELAntworten:
Wenn Sie ein Hover-ähnliches Ereignis für ein HTML-Element ausführen möchten, können Sie dies folgendermaßen tun.
HTML
Komponente
Sie sollten sowohl Mouseenter- als auch Mouseleave-Ereignisse verwenden, um voll funktionsfähige Hover-Ereignisse in Winkel 2 zu implementieren.
quelle
Ja, es gibt
on-mouseover
in Angular2 stattng-Mouseover
wie in Angular 1.x, also müssen Sie Folgendes schreiben: -Wie @Gunter im Kommentar vorgeschlagen hat, gibt es eine Alternative, von der
on-mouseover
wir dies auch verwenden können. Einige Leute bevorzugen die On-Präfix-Alternative, die als kanonische Form bekannt ist.Aktualisieren
HTML Quelltext -
Controller / .TS Code -
Arbeitsbeispiel
Einige andere Mausereignisse können in Angular verwendet werden -
quelle
<div (mouseover)='over()'
? ;-)Sie können es mit einem Host tun:
Passen Sie es einfach an Ihren Code an (zu finden unter: https://angular.io/docs/ts/latest/guide/attribute-directives.html )
quelle
Wenn Sie daran interessiert sind, dass die Maus eine Ihrer Komponenten betritt oder verlässt, können Sie den
@HostListener
Dekorator verwenden:Wie im Link im @ Brandon-Kommentar zu OP erläutert ( https://angular.io/docs/ts/latest/guide/attribute-directives.html )
quelle
Einfach
(mouseenter)
Attribut in Angular2 + ...In Ihrem HTML tun:
und in Ihrer Komponente tun Sie:
quelle
Um das Ereignis beim Overing zu behandeln, können Sie Folgendes ausprobieren (es funktioniert bei mir):
In der HTML-Vorlage:
In der Winkelkomponente:
quelle
Wenn Sie mit der Maus über die gesamte Komponente fahren möchten, können Sie direkt
@hostListener
die Ereignisse behandeln, um die Maus über alle unten aufgeführten Elemente auszuführen.Es ist verfügbar in
@angular/core
. Ich habe es im Winkel getestet4.x.x
quelle
http://lishman.io/angular-2-event-binding
quelle
In Ihrer js / ts-Datei für das HTML, über das der Mauszeiger bewegt wird
In Ihrem HTML wird das schweben
In Ihrer js / ts-Datei, die Informationen über den Schwebeflug erhält
In Ihrem HTML-Element, das mit dem Abfangen der js / ts-Datei verbunden ist
quelle