本文整理匯總了TypeScript中rxjs/operators/distinctUntilChanged.distinctUntilChanged函數的典型用法代碼示例。如果您正苦於以下問題:TypeScript distinctUntilChanged函數的具體用法?TypeScript distinctUntilChanged怎麽用?TypeScript distinctUntilChanged使用的例子?那麽, 這裏精選的函數代碼示例或許可以為您提供幫助。
在下文中一共展示了distinctUntilChanged函數的6個代碼示例,這些例子默認根據受歡迎程度排序。您可以為喜歡或者感覺有用的代碼點讚,您的評價將有助於係統推薦出更棒的TypeScript代碼示例。
示例1: getFormInputStream
export function getFormInputStream(
document: Document,
socket$: Inputs["socket$"],
option$: Inputs["option$"]
): Observable<OutgoingSocketEvent> {
const canSync$ = createTimedBooleanSwitch(
socket$.pipe(filter(([name]) => name === IncomingSocketNames.Keyup))
);
return option$.pipe(
skip(1), // initial option set before the connection event
pluck("ghostMode", "forms", "inputs"),
distinctUntilChanged(),
switchMap(formInputs => {
if (!formInputs) {
return empty();
}
return fromEvent(document.body, "keyup", true).pipe(
map((e: Event) => e.target || e.srcElement),
filter(
(target: Element) =>
target.tagName === "INPUT" ||
target.tagName === "TEXTAREA"
),
withLatestFrom(canSync$),
filter(([, canSync]) => canSync),
map(([eventTarget]) => {
const target = getElementData(eventTarget);
const value = eventTarget.value;
return KeyupEvent.outgoing(target, value);
})
);
})
);
}
示例2: getScrollStream
export function getScrollStream(
window: Window,
document: Document,
socket$: Inputs["socket$"],
option$: Inputs["option$"]
): Observable<OutgoingSocketEvent> {
const canSync$ = createTimedBooleanSwitch(
socket$.pipe(filter(([name]) => name === IncomingSocketNames.Scroll))
);
/**
* If the option 'scrollElementMapping' is provided
* we cache thw
* @type {Observable<(Element | null)[]>}
*/
const elemMap$ = option$.pipe(
pluck("scrollElementMapping"),
map((selectors: string[]) =>
selectors.map(selector => document.querySelector(selector))
)
);
return option$.pipe(
skip(1), // initial option set before the connection event
pluck("ghostMode", "scroll"),
distinctUntilChanged(),
switchMap(scroll => {
if (!scroll) return empty();
return fromEvent(document, "scroll", true).pipe(
map((e: Event) => e.target),
withLatestFrom(canSync$, elemMap$),
filter(([, canSync]) => Boolean(canSync)),
map(([target, canSync, elemMap]: [any, boolean, any[]]) => {
if (target === document) {
return ScrollEvent.outgoing(
getScrollPosition(window, document),
"document",
0
);
}
const elems = document.getElementsByTagName(target.tagName);
const index = Array.prototype.indexOf.call(
elems || [],
target
);
return ScrollEvent.outgoing(
getScrollPositionForElement(target),
target.tagName,
index,
elemMap.indexOf(target)
);
})
);
})
);
}
示例3: retrieveStock
@Effect()
retrieveStock(): Observable<Action> {
return this.actions$.ofType(StockMarketActionTypes.RETRIEVE).pipe(
tap((action: ActionStockMarketRetrieve) =>
this.localStorageService.setItem(STOCK_MARKET_KEY, {
symbol: action.payload.symbol
})
),
distinctUntilChanged(),
debounceTime(500),
switchMap((action: ActionStockMarketRetrieve) =>
this.service
.retrieveStock(action.payload.symbol)
.pipe(
map(stock => new ActionStockMarketRetrieveSuccess({ stock })),
catchError(error =>
of(new ActionStockMarketRetrieveError({ error }))
)
)
)
);
}
示例4: retrieveStock
@Effect()
retrieveStock(): Observable<Action> {
return this.actions$.ofType(STOCK_MARKET_RETRIEVE).pipe(
tap(action =>
this.localStorageService.setItem(STOCK_MARKET_KEY, {
symbol: action.payload
})
),
distinctUntilChanged(),
debounceTime(500),
switchMap(action =>
this.service.retrieveStock(action.payload).pipe(
map(stock => ({
type: STOCK_MARKET_RETRIEVE_SUCCESS,
payload: stock
})),
catchError(err =>
of({ type: STOCK_MARKET_RETRIEVE_ERROR, payload: err })
)
)
)
);
}
示例5: getClickStream
export function getClickStream(
document: Document,
socket$: Inputs["socket$"],
option$: Inputs["option$"]
): Observable<OutgoingSocketEvent> {
const canSync$ = createTimedBooleanSwitch(
socket$.pipe(filter(([name]) => name === IncomingSocketNames.Click))
);
return option$.pipe(
skip(1), // initial option set before the connection event
pluck("ghostMode", "clicks"),
distinctUntilChanged(),
switchMap(canClick => {
if (!canClick) {
return empty();
}
return fromEvent(document, "click", true).pipe(
map((e: Event) => e.target),
filter((target: any) => {
if (target.tagName === "LABEL") {
const id = target.getAttribute("for");
if (id && document.getElementById(id)) {
return false;
}
}
return true;
}),
withLatestFrom(canSync$),
filter(([, canSync]) => canSync),
map(([target]): OutgoingSocketEvent => {
return ClickEvent.outgoing(getElementData(target));
})
);
})
);
}
示例6: getFormTogglesStream
export function getFormTogglesStream(
document: Document,
socket$: Inputs["socket$"],
option$: Inputs["option$"]
): Observable<OutgoingSocketEvent> {
const canSync$ = createTimedBooleanSwitch(
socket$.pipe(
filter(([name]) => name === IncomingSocketNames.InputToggle)
)
);
return option$.pipe(
skip(1),
pluck("ghostMode", "forms", "toggles"),
distinctUntilChanged(),
switchMap(canToggle => {
if (!canToggle) {
return empty();
}
return fromEvent(document, "change", true).pipe(
map((e: Event) => e.target || e.srcElement),
filter((elem: HTMLInputElement) => elem.tagName === "SELECT"),
withLatestFrom(canSync$),
filter(([, canSync]) => canSync),
map(([elem, canSync]: [HTMLInputElement, boolean]) => {
const data = getElementData(elem);
return FormToggleEvent.outgoing(data, {
type: elem.type,
checked: elem.checked,
value: elem.value
});
})
);
})
);
}