Angular 4 - 将事件转换为可观察的流

Question

我对Rxjs和Angular 4相当陌生，无法让我的脑袋知道如何做到这一点。

模板：

<div class="btn-group cp"> 
    <input [colorPicker]="bgColor" 
    (colorPickerChange)="colorChanged()" 
    [style.background]="bgColor"> 
</div> 

colorChanged（）获取上鼠标移动称为由colorPickerChnage。我想在我的组件是这样的：

colorChanged$.subscribe(data => console.log(data)) 

（它会产生一定的反跳和更多的用户，这就是为什么我希望把它作为一个观察的。）

Answer 1

我解决它。

模板：

<div class="btn-group cp"> 
    <input [colorPicker]="bgColor" 
    (colorPickerChange)="colorChanged(bgColor)" 
    [style.background]="bgColor"> 
</div> 

然后在组件：

import { Subject } from 'rxjs'; 

    colorChanged$ = new Subject<string>(); 

    colorChanged(bgColor) { 
    this.colorChanged$.next(bgColor) 
    } 

    ngOnInit() { 
    this.colorChanged$.subscribe(v => console.log(v)); 
    }