Skip to content

Instantly share code, notes, and snippets.

@TheMcMurder

TheMcMurder/index.html

Last active February 19, 2020 16:36
Show Gist options
  • Save TheMcMurder/6359d84b42d33b30ab24af1085c70a60 to your computer and use it in GitHub Desktop.
Save TheMcMurder/6359d84b42d33b30ab24af1085c70a60 to your computer and use it in GitHub Desktop.
Download ZIP
Working rxjs
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
<title></title>
<script src='https://cdn.jsdelivr.net/npm/[email protected]/dist/system.js'></script>
<script src='https://cdn.jsdelivr.net/npm/[email protected]/dist/extras/amd.js'></script>
<script src='https://cdn.jsdelivr.net/npm/[email protected]/dist/extras/named-exports.js'></script>
<script src='https://cdn.jsdelivr.net/npm/[email protected]/dist/extras/named-register.js'></script>
<script src='https://cdn.jsdelivr.net/npm/[email protected]/dist/extras/use-default.js'></script>
<link rel='preload' as='script' href="https://cdn.jsdelivr.net/npm/@reactivex/[email protected]/dist/global/rxjs.umd.js" crossorigin='anonymous'>
</head>
<body>
<script type="systemjs-importmap">
{
"imports":{
"rx": "https://cdn-integ.canopy.ninja/sofe/common-dependencies/78092c0936/rx.js",
"rxjs":"https://cdn.jsdelivr.net/npm/@reactivex/[email protected]/dist/global/rxjs.umd.js"
}
}
</script>
<script>
// rxjs hack
const originalResolve = System.resolve
System.resolve = function (name) {
if (name === 'rxjs/operators') {
return 'rxjs-operators.js'
} else {
return originalResolve.apply(this, arguments)
}
}
System.register('rxjs-operators.js', ['rxjs'], function(_export) {
let rxjs = {}
return {
setters: [
function (rxjsL) {
rxjs = rxjsL
}
],
execute: function () {
_export(rxjs.operators)
}
}
})
</script>
<div>
<button onClick='workingStream()'>Trigger observable stream</button>
</div>
</body>
<script>
function workingStream() {
setTimeout(() => {
Promise.all([
System.import('rx'),
System.import('rxjs'),
System.import('rxjs/operators')
]).then(([rx, rxjs, operators]) => {
console.log('operators', operators)
console.log('rxjs', rxjs)
const sub = rxjs.interval(1000).pipe(
operators.tap((v) => console.log('v', v)),
operators.finalize(() => {
console.log('************************')
console.log('finalize called')
console.log('************************')
})
).subscribe()
setTimeout(() => {
console.log('trigger unsubscribe on failing stream')
sub.unsubscribe()
}, 3000)
})
}, 3000)
}
</script>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment