Czy można używać HostListener w usłudze?

Question

Chcę utworzyć usługę, która wykrywa wszystkie wejścia klawiatury, tłumaczy obrysy klawiszy na akcje oparte na konfigurowalnym odwzorowaniu i eksponuje obiekty obserwowalne, z którymi mogą wiązać się różne elementy, aby reagować na określone naciśnięcia przycisków.

Poniżej znajduje się uproszczenie mojego kodu do tej pory, działało, gdy HostListener był w komponencie, ale teraz przeniosłem go do usługi, która nigdy nie odpala, mimo że jest zdecydowanie inicjowana. Czy nie można wykryć takiego wejścia w usłudze?

import { Injectable, HostListener } from '@angular/core'; 

import { Subject } from 'rxjs/Subject'; 

@Injectable() 
export class InputService { 

    @HostListener('window:keydown', ['$event']) 
    keyboardInput(event: any) { 
     console.log(event); 
    } 
} 

Answer 1

Wygląda na to, że nie można go używać w serwisie.

Musisz użyć starego sposobu: window.addEventListener, jak @yurzui wskazał już.

https://plnkr.co/edit/tc53cvQDfLHhaR68ilKr?p=preview

import {Component, NgModule, HostListener, Injectable} from '@angular/core' 
import {BrowserModule} from '@angular/platform-browser' 

@Injectable() 
export class MyService { 

    constructor() { 
    window.addEventListener('keydown', (event) => { 
     console.dir(event); 
    }); 
    } 

} 

@Component({ 
    selector: 'my-app', 
    template: ` 
    <div> 
     <h2>Hello {{name}}</h2> 
    </div> 
    `, 
}) 
export class App { 

    constructor(private _srvc: MyService) { 
    this.name = 'Angular2' 
    } 
} 

@NgModule({ 
    imports: [ BrowserModule ], 
    declarations: [ App ], 
    providers: [MyService], 
    bootstrap: [ App ] 
}) 
export class AppModule {}