本文整理匯總了TypeScript中rxjs.Observable.fromEvent方法的典型用法代碼示例。如果您正苦於以下問題：TypeScript Observable.fromEvent方法的具體用法？TypeScript Observable.fromEvent怎麽用？TypeScript Observable.fromEvent使用的例子？那麽, 這裏精選的方法代碼示例或許可以為您提供幫助。您也可以進一步了解該方法所在類rxjs.Observable的用法示例。
在下文中一共展示了Observable.fromEvent方法的10個代碼示例，這些例子默認根據受歡迎程度排序。您可以為喜歡或者感覺有用的代碼點讚，您的評價將有助於係統推薦出更棒的TypeScript代碼示例。
示例1: constructor
constructor(private _socket: SocketIO.Socket){
this.id = _socket.id;
this.messages = Observable.fromEvent(_socket, 'message');
let disconnect = Observable.fromEvent(_socket, 'disconnect');
let outgoing = (message) => _socket.send(message);
this.broadcasts = this.messages.filter(message => message.broadcast);
this.pings = this.messages.filter(message => message.action === 'ping');
}示例2:
export const heroShots$Fac = (heroShots: iHeroShot[], heroShip$: Observable<iHeroShip>): Observable<iHeroShot[]> => {
return Observable.fromEvent(canvas, 'click')
.throttleTime(100)
.withLatestFrom(heroShip$, (event, heroShip) => heroShip)
.scan((acc, heroShip) => {
acc.push(Object.assign({}, heroShip))
return acc
}, heroShots)
.startWith(heroShots)
.switchMap(heroShots => {
return Observable.interval(config.commons.moveInterval)
.map(tick => {
// return heroShots.reduce((newHeroShots, heroShot) => {
// heroShot.y -= config.heroShot.moveSpeed.y;
// if (heroShot.y >= 0 - config.heroShot.halfBottomLength) {
// newHeroShots.push(Object.assign({}, heroShot));
// }
// return newHeroShots;
// }, []);
heroShots.forEach((heroShot, index, heroShots) => {
heroShot.y -= config.heroShot.moveSpeed.y;
if (heroShot.y <= 0 - config.heroShot.halfBottomLength) {
heroShots.splice(index, 1);
}
})
return heroShots
})
})
.startWith(heroShots)
}示例3: showNotification
showNotification(channelId: ChannelId, from: string, text: string): void {
const settings = this._config.get();
if (settings.notification) {
// FIXME: should call in `NotificationActionCreator.showNotification()`
this._notifyAction.playSound();
}
if (settings.badge && Notification.permission === 'granted') {
let notification = new Notification(from + ' says:', {
body: text,
icon: ICON_URL,
});
const timeout: Rx.Observable<void> = Rx.Observable.empty<void>().delay(5 * 1000);
const click: Rx.Observable<void> = Rx.Observable.fromEvent<void>(notification, 'click').take(1).do<void>(() => {
this._uiAction.focusWindow();
this._uiAction.selectChannel(channelId);
});
const close: Rx.Observable<void> = click.race(timeout);
close.subscribe(function(){}, function(){}, function(){
notification.close();
notification = null;
});
}
}示例4: run
export function run(){
const clickStream = Observable.fromEvent(document.getElementById('refresh'),'click');
clickStream.subscribe(
(event:Event) => console.log(event.type)
);
}示例5: constructor
constructor() {
let windowSize$ = new BehaviorSubject(getWindowSize());
this.width$ = (windowSize$.pluck('width') as Observable<number>).distinctUntilChanged();
this.height$ = (windowSize$.pluck('height') as Observable<number>).distinctUntilChanged();
Observable.fromEvent(window, 'resize')
.map(getWindowSize)
.subscribe(windowSize$);
}示例6: getCharacters
public getCharacters(){
const txt = document.getElementById("character");
let keyups$ = Observable.fromEvent(txt, "keyup");
let letters$ = keyups$.map((ev:any) => ev.target.value);
return letters$.switchMap(p => this.http
.get("api/region/" + this.region + "/realm/" + this.realm + "/character/" + p))
.map((res:Response) => res.json())
.catch((err:any, caught:Observable<any>) => caught);
}示例7: switch
let event = (() => {
let event = Observable.fromEvent(this.client, eventType)
switch (eventType) {
case 'message':
return event.filter((m: Message) => m.author.id != this.client.user.id && !m.author.bot)
default:
return event
}
})()示例8: initDrag
/**
* 初始化元素拖拽
*/
initDrag(target: HTMLElement, fn: Function, options?: any): { destroy: Function } {
let dragObj: any = {};
let subArr: Array<Subscription> = [];
let sub;
// 鼠標按下時，標記拖拽開始
sub = Observable.fromEvent(target, 'mousedown')
.subscribe((e: MouseEvent) => {
dragObj = {
pageX: e.pageX,
pageY: e.pageY,
draging: true
};
if (typeof options.processDragObj === 'function') {
options.processDragObj(dragObj);
}
});
subArr.push(sub);
// 鼠標移動時，開始執行拖拽
sub = Observable.fromEvent(document, 'mousemove')
.throttleTime(options.throttleTime || 20)
.subscribe((e: MouseEvent) => {
if (!dragObj.draging) {
return;
}
fn(dragObj, e);
});
subArr.push(sub);
// 鼠標鬆開時，停止拖拽
sub = Observable.fromEvent(document, 'mouseup')
.subscribe((e: MouseEvent) => {
dragObj.draging = false;
});
subArr.push(sub);
return {
destroy() {
subArr.forEach(sub => sub.unsubscribe());
}
}
}示例9: fun
Array.prototype.forEach.call(element.querySelectorAll('[on-click]'), (elem) => {
if (obj[elem.getAttribute('on-click')] instanceof Subject) {
Observable.fromEvent(elem, 'click').subscribe((event) =>
Listeners.convertStringToAtrrCall(elem, 'on-click', obj).next(event)
);
}
if (typeof obj[elem.getAttribute('on-click')] === 'function') {
elem.addEventListener('click', (event) => {
const fun = Listeners.convertStringToAtrrCall(event.currentTarget, 'on-click', obj).bind(obj);
fun(event);
});
}
});示例10: _handleClickEvent
private _handleClickEvent(): Rx.Subscription {
// tslint:disable-next-line:no-non-null-assertion
return Rx.Observable.fromEvent<Element>(this._element!, 'click', (event: UIEvent) => event.target as Element)
.filter((target: Element): boolean => (target.localName === 'button'))
.subscribe((target: Element) => {
if (target.classList.contains('lt')) {
const shouldOpen: boolean = !this._vm.isOpenedLeftPane.value();
this._vm.isOpenedLeftPane.setValue(shouldOpen);
this._uiAction.toggleLeftPane(shouldOpen);
}
else if (target.classList.contains('rt')) {
const shouldOpen: boolean = !this._vm.isOpenedRightPane.value();
this._vm.isOpenedRightPane.setValue(shouldOpen);
}
});
}