fromEvent ?

<button (click)="runSimulation()"
>New simulation
</button>

и в ts:

private newSimulationClicks$ = new Subject();
runSimulation() {
  this.newSimulationClicks$.next();
}

а чо ему туда в параметры пихать, этому фромЭвенту? Через ViewChild мучаться получать доступ?

@ViewChild('searchInput') 
input: ElementRef;

const a$ = fromEvent<any>(this.input.nativeElement, 'keyup')

@ViewChild('searchInput') 
input: ElementRef;

const a$ = fromEvent<any>(this.input.nativeElement, 'keyup')

Да походу )

По-другому никак

еще изящнее не выйдет?

ну, с другой стороны, приличнее выходит, чем через сабджект

Через директиву)

а как?

или это в порядке юмора?

Директива получает уже елмреф

А аутпутит observable

По клику

Ну пока что да, я на этапе распределения роутов знаю какие у меня айди и просто через enum подставляю нужное мне значение роута

так себе оно выглядит, конечно ,если angular material используется.
matButton:

@ViewChild('newSimulationButton', { static: false, read: ElementRef })
newSimulationButton: ElementRef;
...
const newSimulationClicks$ = fromEvent(this.newSimulationButton.nativeElement, 'click');

а вот matSlideToggle:

@ViewChild('autoModeSlideToggle', { static: false })
autoModeSlideToggle: MatSlideToggle;
...
const autoMode$ = this.autoModeSlideToggle.change;

@ViewChild('newSimulationButton', { static: false, read: ElementRef })
newSimulationButton: ElementRef;
...
const newSimulationClicks$ = fromEvent(this.newSimulationButton.nativeElement, 'click');

@ViewChild('autoModeSlideToggle', { static: false })
autoModeSlideToggle: MatSlideToggle;
...
const autoMode$ = this.autoModeSlideToggle.change;

Тоже правда

ребята, в каком случае вы используете ангуляр-сервисы, а в каком - можно обойтись просто висящей где-то в воздухе функцией? Вот например, есть у меня функция, форматирующая список лекарств. Пока что она сидит внутри компонента:

export class DrugsShortComponent implements OnInit {

  @Input()
  drugs: Drug[];

  drugsFormatted: string;

  constructor() {
  }

  ngOnInit() {
    this.drugsFormatted = this.formatDrugs();
  }

  private formatDrugs(): string {
    return this.drugs.length ? this.drugs
      .map(drugFullName => drugFullName.substring(0, 3))
      .join(', ') : 'No drugs given';
  }
}

Мне, понятное дело, хочется ее тестировать удобно, плюс я читал, что вся логика должна быть  в сервисах, а компоненты должны быть тупенькие
1) Надо создать stateless DrugFormattingService с единственной функцией?
2) надо просто сделать ее статической и оставить в классе компонента?
3) надо просто сделать ее свободной функцией и оставить в файле компонента?

export class DrugsShortComponent implements OnInit {

  @Input()
  drugs: Drug[];

  drugsFormatted: string;

  constructor() {
  }

  ngOnInit() {
    this.drugsFormatted = this.formatDrugs();
  }

  private formatDrugs(): string {
    return this.drugs.length ? this.drugs
      .map(drugFullName => drugFullName.substring(0, 3))
      .join(', ') : 'No drugs given';
  }
}

Выглядит как статическая в utils классе

а вот какой ход рассуждений?

Хотя судя по всему в идеале вообще сделать pipe и избавиться от drugsFormatted