EventEmitter no funciona en Chrome / Safari
Creé (con mucha ayuda), la siguiente directiva, donde estoy rastreando la posición Y de una pantalla y disparando un evento con esta información.
import {Directive, Output, EventEmitter} from "angular2/core";
@Directive({
selector: '[track-scroll]',
host: {'(window:scroll)': 'track($event)'},
})
export class TrackScrollDirective {
@Output('pageYPositionChange') pageYPositionChange: EventEmitter<any> = new EventEmitter();
track($event: any) {
this.pageYPositionChange.emit($event.pageY);
}
}
Y tratando de escuchar ese evento en un componente:
import {TrackScrollDirective} from "../directives/track-scroll.directive";
@Component({
selector: 'app-header',
moduleId: module.id,
templateUrl: './app-header.component.html',
directives: [Collapse, DROPDOWN_DIRECTIVES, ROUTER_DIRECTIVES, TrackScrollDirective]
})
export class AppHeader {
public isCollapsed:boolean = false;
pageY: number = 0;
constructor (
public authService: AuthenticationService
) {}
onPageYChange(pageY: number) {
this.pageY = pageY;
console.debug("PageY Pos ", pageY );
}
}
donde en la plantilla de ese componente tenemos lo siguiente:
<nav class="navbar navbar-default navbar-fixed-top top-navbar" track-scroll (pageYPositionChange)="onPageYChange($event)" [ngClass]="{floating: pageY > 10}">
Todo funciona a la perfección en FF, pero eso es todo, en ningún otro lado. (probado safari, cromo)
¿Lo que falta? Mi único pensamiento es que estoy usando malEventEmitter
ACTUALIZAR
Aparentemente$event.pageY
no existe en Chrome ... y, de hecho, no hay información sobre la posición de la página. ¿De dónde lo obtengo?