Я пытаюсь прослушивать события на window
из приложения углового2, написанного на машинописном машинописном тексте. Я также использую jquery (добавлен через typings
).Прослушивание событий окна на машинописном (angular2)
События, которые я хочу прослушать, добавляются внешней библиотекой, которую я добавляю в теги <script>
на index.html. Если добавить слушателя window
на index.html, он работает нормально:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<script src="http://my-host/front-libs/jquery/1.8.3/jquery-1.8.3.min.js"></script>
<script src="https://my-host/my-external-lib.min.js"></script>
<title>Angular 2 App | ng2-webpack</title>
<link rel="icon" type="image/x-icon" href="/img/favicon.ico">
<script>
// this works!!
$(window).on('authenticatedUser', function(e) {
console.log('ok.');
});
</script>
<base href="/">
</head>
<body>
<my-app>Loading...</my-app>
</body>
</html>
Но если я стараюсь слушать те же события из моей angular2 приложения, он не делает:
import { Component, OnInit } from '@angular/core';
import { ROUTER_DIRECTIVES } from '@angular/router';
import { ApiService } from './shared';
import '../style/app.scss';
/*
* App Component
* Top Level Component
*/
@Component({
selector: 'my-app', // <my-app></my-app>
providers: [ApiService],
directives: [...ROUTER_DIRECTIVES],
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss'],
})
export class AppComponent implements OnInit {
url = 'https://github.com/preboot/angular2-webpack';
ngOnInit(){
// this doesn't seem to work. I never get notified about
// 'authenticatedUser' events on `window`
$((<any>window)).on('authenticatedUser', function(e) {
console.log('fuuuu');
});
// this triggers events on `window`
(<any>window).myNamespace.start({
scopeName: null,
canClose: false,
returnUrl: 'http://localhost:8080/loggedIn'
});
}
constructor(private api: ApiService) { }
}
Правильно ли это подключить обработчики событий к окну из приложения angular2? Я чувствую, что должен быть лучший способ.
вы пытались HostListener ?? –