Angular 2 - подписка на ошибку Observable.fromEvent: "Неверная цель события"

Я получаю странную ошибку при попытке подписаться на Observable.

Вот приведенная ниже версия кода, которая представляет проблему:

import {Component, Input, OnInit, ViewChild} from '@angular/core';
import Rx from 'rxjs/Rx';

@Component({
  selector: 'action-overview-description',
  template: require('./actionOverviewDescription.html')
})
export class ActionOverviewDescription  {
  @ViewChild('button') button;

  constructor() {}
  
   ngOnInit() {

    let buttonStream$ = Rx.Observable.fromEvent(this.button, 'click')
        .subscribe(res => console.log(res));

  }
}
<button #input>Button</button>

Ответы

Ответ 1

Проблема в том, какой хук жизненного цикла вы используете. Элемент еще не ngOnInit в DOM, когда ngOnInit. Вместо этого вы должны использовать ngAfterViewInit.

Не могли бы вы попробовать следующий код:

import { Component, ViewChild, ElementRef, AfterViewInit } from '@angular/core';
import { Observable, fromEvent } from 'rxjs';

@Component({
  template: '<button #input>Button</button>'
})
export class ActionOverviewDescription implements AfterViewInit {
  @ViewChild('input') button: ElementRef;

  ngAfterViewInit() {
    let buttonStream$ = Observable.fromEvent(this.button.nativeElement, 'click')
        .subscribe(res => console.log(res));

  }
}