观察员和更新的类属性

我有styles属性的类，它通过双向数据绑定[(ngModel)]="styles"在模板中更新。观察员和更新的类属性

我如何创建基于此属性的Observer，当我在输入内更改该属性时，每次都会向观察者订阅者提供新的更新值？

现在，我做了两件事：

双向数据绑定[（ngModel）] = “样式”
投入使用keyUp处理程序，其中我把类styles财产的next（）主体的方法。

任何更好的方法来做到这一点？

// template 
<input type="text" [(ngModel)]="styles.background" (keyup)="onInputChange($event)"> 


// component 
private onInputChange (event): void { 
    this.stylesService 
     .getStyles() 
     .next(this.styles); 
}

来源

2016-02-26 Качалов Тимофей

请添加一些代码来演示你实际尝试完成的任务。 –

添加了当前代码 –

它更好，但仍不清楚你的观察者是什么意思。应该注意什么以及应该通知哪些变化？ –

让你的头部缠着观测需要时间，但它是值得的:)如果我正确理解你的问题，你想建立一个input场，你可以手动输入，它的值时发出的所有正在听你StylesService听众，这里有这样的服务的代码：

import {Injectable} from "angular2/core"; 
import {Observable} from 'rxjs/Observable'; 
import 'rxjs/add/operator/share'; 

@Injectable() 
export class StylesService{ 
    public styles$: Observable<any>; // Anyone can subscribe to this variable 
    private _data: any = {}; 
    private _observer: Observer<any>; 

    constructor() { 
    this.styles$ = Observable.create(observer => { 
     this._observer = observer; 
    }).share(); 
    }; 

    update(newValue) { 
    this._data = newValue; 
    this._observer.next(newValue); 
    } 
}

您可以订阅该服务在您的组件是这样的：

@Component({...}) 
export class AppComponent { 
    observedStyles: any = { background: 'red' }; 

    constructor(private stylesService: StylesService) { 
    stylesService.styles$.subscribe((data) => { 
     this.observedStyles = data; 
    }); 
    } 

    private onInputChange(event): void { 
    this.stylesService.update({ background: event.target.value }); 
    } 
}

我创建了一个plunker，所以你可以自己探索一下：http://plnkr.co/edit/MlyYKjaFPlkJPAKCik7t?p=preview

来源

2016-02-27 16:18:04 mseimys

观察员和更新的类属性

回答

相关问题