├── src ├── assets │ └── .gitkeep ├── app │ ├── app.component.css │ ├── pages │ │ ├── subject │ │ │ ├── subject.component.css │ │ │ ├── subject.component.html │ │ │ └── subject.component.spec.ts │ │ ├── operators │ │ │ ├── operators.component.css │ │ │ ├── operators.component.ts │ │ │ └── operators.component.spec.ts │ │ ├── map-operator │ │ │ ├── map-operator.component.css │ │ │ ├── map-operator.component.html │ │ │ └── map-operator.component.spec.ts │ │ ├── max-operator │ │ │ ├── max-operator.component.css │ │ │ ├── max-operator.component.html │ │ │ ├── max-operator.component.spec.ts │ │ │ └── max-operator.component.ts │ │ ├── min-operator │ │ │ ├── min-operator.component.css │ │ │ ├── min-operator.component.html │ │ │ ├── min-operator.component.spec.ts │ │ │ └── min-operator.component.ts │ │ ├── schedulers │ │ │ ├── schedulers.component.css │ │ │ ├── schedulers.component.html │ │ │ ├── schedulers.component.spec.ts │ │ │ └── schedulers.component.ts │ │ ├── void-subject │ │ │ ├── void-subject.component.css │ │ │ ├── void-subject.component.html │ │ │ ├── void-subject.component.spec.ts │ │ │ └── void-subject.component.ts │ │ ├── zip-operator │ │ │ ├── zip-operator.component.css │ │ │ ├── zip-operator.component.html │ │ │ ├── zip-operator.component.ts │ │ │ └── zip-operator.component.spec.ts │ │ ├── ajax-operator │ │ │ ├── ajax-operator.component.css │ │ │ ├── ajax-operator.component.html │ │ │ └── ajax-operator.component.spec.ts │ │ ├── async-subject │ │ │ ├── async-subject.component.css │ │ │ ├── async-subject.component.html │ │ │ ├── async-subject.component.spec.ts │ │ │ └── async-subject.component.ts │ │ ├── audit-operator │ │ │ ├── audit-operator.component.css │ │ │ ├── audit-operator.component.html │ │ │ ├── audit-operator.component.ts │ │ │ └── audit-operator.component.spec.ts │ │ ├── count-operator │ │ │ ├── count-operator.component.css │ │ │ ├── count-operator.component.html │ │ │ ├── count-operator.component.ts │ │ │ └── count-operator.component.spec.ts │ │ ├── defer-operator │ │ │ ├── defer-operator.component.css │ │ │ ├── defer-operator.component.html │ │ │ ├── defer-operator.component.spec.ts │ │ │ └── defer-operator.component.ts │ │ ├── delay-operator │ │ │ ├── delay-operator.component.css │ │ │ ├── delay-operator.component.html │ │ │ ├── delay-operator.component.ts │ │ │ └── delay-operator.component.spec.ts │ │ ├── every-operator │ │ │ ├── every-operator.component.css │ │ │ ├── every-operator.component.html │ │ │ ├── every-operator.component.ts │ │ │ └── every-operator.component.spec.ts │ │ ├── find-operator │ │ │ ├── find-operator.component.css │ │ │ ├── find-operator.component.html │ │ │ ├── find-operator.component.ts │ │ │ └── find-operator.component.spec.ts │ │ ├── first-operator │ │ │ ├── first-operator.component.css │ │ │ ├── first-operator.component.html │ │ │ └── first-operator.component.spec.ts │ │ ├── last-operator │ │ │ ├── last-operator.component.css │ │ │ ├── last-operator.component.html │ │ │ └── last-operator.component.spec.ts │ │ ├── merge-operator │ │ │ ├── merge-operator.component.css │ │ │ ├── merge-operator.component.html │ │ │ ├── merge-operator.component.spec.ts │ │ │ └── merge-operator.component.ts │ │ ├── race-operator │ │ │ ├── race-operator.component.css │ │ │ ├── race-operator.component.html │ │ │ ├── race-operator.component.spec.ts │ │ │ └── race-operator.component.ts │ │ ├── range-operator │ │ │ ├── range-operator.component.css │ │ │ ├── range-operator.component.html │ │ │ ├── range-operator.component.ts │ │ │ └── range-operator.component.spec.ts │ │ ├── replay-subject │ │ │ ├── replay-subject.component.css │ │ │ ├── replay-subject.component.html │ │ │ ├── replay-subject.component.spec.ts │ │ │ └── replay-subject.component.ts │ │ ├── retry-operator │ │ │ ├── retry-operator.component.css │ │ │ ├── retry-operator.component.html │ │ │ ├── retry-operator.component.spec.ts │ │ │ └── retry-operator.component.ts │ │ ├── scan-operator │ │ │ ├── scan-operator.component.css │ │ │ ├── scan-operator.component.html │ │ │ └── scan-operator.component.spec.ts │ │ ├── share-operator │ │ │ ├── share-operator.component.css │ │ │ ├── share-operator.component.html │ │ │ ├── share-operator.component.spec.ts │ │ │ └── share-operator.component.ts │ │ ├── skip-operator │ │ │ ├── skip-operator.component.css │ │ │ ├── skip-operator.component.html │ │ │ ├── skip-operator.component.ts │ │ │ └── skip-operator.component.spec.ts │ │ ├── take-operator │ │ │ ├── take-operator.component.css │ │ │ ├── take-operator.component.html │ │ │ ├── take-operator.component.ts │ │ │ └── take-operator.component.spec.ts │ │ ├── timer-operator │ │ │ ├── timer-operator.component.css │ │ │ ├── timer-operator.component.html │ │ │ └── timer-operator.component.spec.ts │ │ ├── behavior-subject │ │ │ ├── behavior-subject.component.css │ │ │ ├── behavior-subject.component.html │ │ │ ├── behavior-subject.component.ts │ │ │ └── behavior-subject.component.spec.ts │ │ ├── buffer-operator │ │ │ ├── buffer-operator.component.css │ │ │ ├── buffer-operator.component.html │ │ │ ├── buffer-operator.component.spec.ts │ │ │ └── buffer-operator.component.ts │ │ ├── cold-observable │ │ │ ├── cold-observable.component.css │ │ │ ├── cold-observable.component.html │ │ │ └── cold-observable.component.spec.ts │ │ ├── concat-component │ │ │ ├── concat-component.component.css │ │ │ ├── concat-component.component.html │ │ │ └── concat-component.component.spec.ts │ │ ├── concat-operator │ │ │ ├── concat-operator.component.css │ │ │ ├── concat-operator.component.html │ │ │ ├── concat-operator.component.spec.ts │ │ │ └── concat-operator.component.ts │ │ ├── debounce-operator │ │ │ ├── debounce-operator.component.css │ │ │ ├── debounce-operator.component.html │ │ │ ├── debounce-operator.component.spec.ts │ │ │ └── debounce-operator.component.ts │ │ ├── distinct-operator │ │ │ ├── distinct-operator.component.css │ │ │ ├── distinct-operator.component.html │ │ │ ├── distinct-operator.component.spec.ts │ │ │ └── distinct-operator.component.ts │ │ ├── filter-operator │ │ │ ├── filter-operator.component.css │ │ │ ├── filter-operator.component.html │ │ │ └── filter-operator.component.spec.ts │ │ ├── generate-operator │ │ │ ├── generate-operator.component.css │ │ │ ├── generate-operator.component.html │ │ │ ├── generate-operator.component.spec.ts │ │ │ └── generate-operator.component.ts │ │ ├── group-by-operator │ │ │ ├── group-by-operator.component.css │ │ │ ├── group-by-operator.component.html │ │ │ └── group-by-operator.component.spec.ts │ │ ├── is-empty-operator │ │ │ ├── is-empty-operator.component.css │ │ │ ├── is-empty-operator.component.html │ │ │ └── is-empty-operator.component.spec.ts │ │ ├── map-to-operator │ │ │ ├── map-to-operator.component.css │ │ │ ├── map-to-operator.component.html │ │ │ ├── map-to-operator.component.ts │ │ │ └── map-to-operator.component.spec.ts │ │ ├── merge-component │ │ │ ├── merge-component.component.css │ │ │ ├── merge-component.component.html │ │ │ └── merge-component.component.spec.ts │ │ ├── pairwise-operator │ │ │ ├── pairwise-operator.component.css │ │ │ ├── pairwise-operator.component.html │ │ │ ├── pairwise-operator.component.ts │ │ │ └── pairwise-operator.component.spec.ts │ │ ├── reduce-operator │ │ │ ├── reduce-operator.component.css │ │ │ ├── reduce-operator.component.html │ │ │ └── reduce-operator.component.spec.ts │ │ ├── sample-operator │ │ │ ├── sample-operator.component.css │ │ │ ├── sample-operator.component.html │ │ │ ├── sample-operator.component.ts │ │ │ └── sample-operator.component.spec.ts │ │ ├── single-operator │ │ │ ├── single-operator.component.css │ │ │ ├── single-operator.component.html │ │ │ ├── single-operator.component.ts │ │ │ └── single-operator.component.spec.ts │ │ ├── throttle-operator │ │ │ ├── throttle-operator.component.css │ │ │ ├── throttle-operator.component.html │ │ │ ├── throttle-operator.component.ts │ │ │ └── throttle-operator.component.spec.ts │ │ ├── to-array-operator │ │ │ ├── to-array-operator.component.css │ │ │ ├── to-array-operator.component.html │ │ │ ├── to-array-operator.component.ts │ │ │ └── to-array-operator.component.spec.ts │ │ ├── window-operator │ │ │ ├── window-operator.component.css │ │ │ ├── window-operator.component.html │ │ │ ├── window-operator.component.ts │ │ │ └── window-operator.component.spec.ts │ │ ├── concat-all-operator │ │ │ ├── concat-all-operator.component.css │ │ │ ├── concat-all-operator.component.html │ │ │ ├── concat-all-operator.component.ts │ │ │ └── concat-all-operator.component.spec.ts │ │ ├── concat-map-operator │ │ │ ├── concat-map-operator.component.css │ │ │ ├── concat-map-operator.component.html │ │ │ ├── concat-map-operator.component.spec.ts │ │ │ └── concat-map-operator.component.ts │ │ ├── element-at-operator │ │ │ ├── element-at-operator.component.css │ │ │ ├── element-at-operator.component.html │ │ │ ├── element-at-operator.component.ts │ │ │ └── element-at-operator.component.spec.ts │ │ ├── find-index-operator │ │ │ ├── find-index-operator.component.css │ │ │ ├── find-index-operator.component.html │ │ │ ├── find-index-operator.component.ts │ │ │ └── find-index-operator.component.spec.ts │ │ ├── fork-join-operator │ │ │ ├── fork-join-operator.component.css │ │ │ ├── fork-join-operator.component.html │ │ │ ├── fork-join-operator.component.ts │ │ │ └── fork-join-operator.component.spec.ts │ │ ├── merge-all-operator │ │ │ ├── merge-all-operator.component.css │ │ │ ├── merge-all-operator.component.html │ │ │ ├── merge-all-operator.component.spec.ts │ │ │ └── merge-all-operator.component.ts │ │ ├── merge-map-component │ │ │ ├── merge-map-component.component.css │ │ │ ├── merge-map-component.component.html │ │ │ ├── merge-map-component.component.spec.ts │ │ │ └── merge-map-component.component.ts │ │ ├── merge-map-operator │ │ │ ├── merge-map-operator.component.css │ │ │ ├── merge-map-operator.component.html │ │ │ ├── merge-map-operator.component.spec.ts │ │ │ └── merge-map-operator.component.ts │ │ ├── multicast-operator │ │ │ ├── multicast-operator.component.css │ │ │ ├── multicast-operator.component.html │ │ │ └── multicast-operator.component.spec.ts │ │ ├── observe-on-operator │ │ │ ├── observe-on-operator.component.css │ │ │ ├── observe-on-operator.component.html │ │ │ ├── observe-on-operator.component.spec.ts │ │ │ └── observe-on-operator.component.ts │ │ ├── partition-operator │ │ │ ├── partition-operator.component.css │ │ │ ├── partition-operator.component.html │ │ │ ├── partition-operator.component.spec.ts │ │ │ └── partition-operator.component.ts │ │ ├── retry-when-operator │ │ │ ├── retry-when-operator.component.css │ │ │ ├── retry-when-operator.component.html │ │ │ └── retry-when-operator.component.spec.ts │ │ ├── skip-last-operator │ │ │ ├── skip-last-operator.component.css │ │ │ ├── skip-last-operator.component.html │ │ │ ├── skip-last-operator.component.spec.ts │ │ │ └── skip-last-operator.component.ts │ │ ├── skip-until-operator │ │ │ ├── skip-until-operator.component.css │ │ │ ├── skip-until-operator.component.html │ │ │ ├── skip-until-operator.component.spec.ts │ │ │ └── skip-until-operator.component.ts │ │ ├── skip-while-operator │ │ │ ├── skip-while-operator.component.css │ │ │ ├── skip-while-operator.component.html │ │ │ ├── skip-while-operator.component.ts │ │ │ └── skip-while-operator.component.spec.ts │ │ ├── start-with-operator │ │ │ ├── start-with-operator.component.css │ │ │ ├── start-with-operator.component.html │ │ │ ├── start-with-operator.component.ts │ │ │ └── start-with-operator.component.spec.ts │ │ ├── switch-all-operator │ │ │ ├── switch-all-operator.component.css │ │ │ ├── switch-all-operator.component.html │ │ │ ├── switch-all-operator.component.spec.ts │ │ │ └── switch-all-operator.component.ts │ │ ├── switch-map-operator │ │ │ ├── switch-map-operator.component.css │ │ │ ├── switch-map-operator.component.html │ │ │ ├── switch-map-operator.component.spec.ts │ │ │ └── switch-map-operator.component.ts │ │ ├── take-last-operator │ │ │ ├── take-last-operator.component.css │ │ │ ├── take-last-operator.component.html │ │ │ ├── take-last-operator.component.ts │ │ │ └── take-last-operator.component.spec.ts │ │ ├── take-until-operator │ │ │ ├── take-until-operator.component.css │ │ │ ├── take-until-operator.component.html │ │ │ ├── take-until-operator.component.spec.ts │ │ │ └── take-until-operator.component.ts │ │ ├── take-while-operator │ │ │ ├── take-while-operator.component.css │ │ │ ├── take-while-operator.component.html │ │ │ ├── take-while-operator.component.ts │ │ │ └── take-while-operator.component.spec.ts │ │ ├── buffer-count-operator │ │ │ ├── buffer-count-operator.component.css │ │ │ ├── buffer-count-operator.component.html │ │ │ ├── buffer-count-operator.component.ts │ │ │ └── buffer-count-operator.component.spec.ts │ │ ├── buffer-time-operator │ │ │ ├── buffer-time-operator.component.css │ │ │ ├── buffer-time-operator.component.html │ │ │ ├── buffer-time-operator.component.ts │ │ │ └── buffer-time-operator.component.spec.ts │ │ ├── buffer-toggle-operator │ │ │ ├── buffer-toggle-operator.component.css │ │ │ ├── buffer-toggle-operator.component.html │ │ │ ├── buffer-toggle-operator.component.spec.ts │ │ │ └── buffer-toggle-operator.component.ts │ │ ├── buffer-when-operator │ │ │ ├── buffer-when-operator.component.css │ │ │ ├── buffer-when-operator.component.html │ │ │ ├── buffer-when-operator.component.spec.ts │ │ │ └── buffer-when-operator.component.ts │ │ ├── catch-error-operator │ │ │ ├── catch-error-operator.component.css │ │ │ ├── catch-error-operator.component.html │ │ │ ├── catch-error-operator.component.spec.ts │ │ │ └── catch-error-operator.component.ts │ │ ├── concat-map-to-operator │ │ │ ├── concat-map-to-operator.component.css │ │ │ ├── concat-map-to-operator.component.html │ │ │ ├── concat-map-to-operator.component.spec.ts │ │ │ └── concat-map-to-operator.component.ts │ │ ├── dematerialize-operator │ │ │ ├── dematerialize-operator.component.css │ │ │ ├── dematerialize-operator.component.html │ │ │ ├── dematerialize-operator.component.spec.ts │ │ │ └── dematerialize-operator.component.ts │ │ ├── exhaust-all-operator │ │ │ ├── exhaust-all-operator.component.css │ │ │ ├── exhaust-all-operator.component.html │ │ │ ├── exhaust-all-operator.component.spec.ts │ │ │ └── exhaust-all-operator.component.ts │ │ ├── exhaust-map-operator │ │ │ ├── exhaust-map-operator.component.css │ │ │ ├── exhaust-map-operator.component.html │ │ │ ├── exhaust-map-operator.component.spec.ts │ │ │ └── exhaust-map-operator.component.ts │ │ ├── materialize-operator │ │ │ ├── materialize-operator.component.css │ │ │ ├── materialize-operator.component.html │ │ │ ├── materialize-operator.component.spec.ts │ │ │ └── materialize-operator.component.ts │ │ ├── merge-map-to-operator │ │ │ ├── merge-map-to-operator.component.css │ │ │ ├── merge-map-to-operator.component.html │ │ │ ├── merge-map-to-operator.component.spec.ts │ │ │ └── merge-map-to-operator.component.ts │ │ ├── publish-last-operator │ │ │ ├── publish-last-operator.component.css │ │ │ ├── publish-last-operator.component.html │ │ │ └── publish-last-operator.component.spec.ts │ │ ├── subscribe-on-operator │ │ │ ├── subscribe-on-operator.component.css │ │ │ ├── subscribe-on-operator.component.html │ │ │ ├── subscribe-on-operator.component.ts │ │ │ └── subscribe-on-operator.component.spec.ts │ │ ├── switch-map-to-operator │ │ │ ├── switch-map-to-operator.component.css │ │ │ ├── switch-map-to-operator.component.html │ │ │ ├── switch-map-to-operator.component.ts │ │ │ └── switch-map-to-operator.component.spec.ts │ │ ├── window-count-operator │ │ │ ├── window-count-operator.component.css │ │ │ ├── window-count-operator.component.html │ │ │ ├── window-count-operator.component.ts │ │ │ └── window-count-operator.component.spec.ts │ │ ├── window-time-operator │ │ │ ├── window-time-operator.component.css │ │ │ ├── window-time-operator.component.html │ │ │ ├── window-time-operator.component.ts │ │ │ └── window-time-operator.component.spec.ts │ │ ├── window-toggle-operator │ │ │ ├── window-toggle-operator.component.css │ │ │ ├── window-toggle-operator.component.html │ │ │ ├── window-toggle-operator.component.ts │ │ │ └── window-toggle-operator.component.spec.ts │ │ ├── window-when-operator │ │ │ ├── window-when-operator.component.css │ │ │ ├── window-when-operator.component.html │ │ │ ├── window-when-operator.component.ts │ │ │ └── window-when-operator.component.spec.ts │ │ ├── combine-latest-operator │ │ │ ├── combine-latest-operator.component.css │ │ │ ├── combine-latest-operator.component.html │ │ │ ├── combine-latest-operator.component.spec.ts │ │ │ └── combine-latest-operator.component.ts │ │ ├── ignore-elements-operator │ │ │ ├── ignore-elements-operator.component.css │ │ │ ├── ignore-elements-operator.component.html │ │ │ ├── ignore-elements-operator.component.ts │ │ │ └── ignore-elements-operator.component.spec.ts │ │ ├── publish-replay-operator │ │ │ ├── publish-replay-operator.component.css │ │ │ ├── publish-replay-operator.component.html │ │ │ └── publish-replay-operator.component.spec.ts │ │ ├── combine-latest-all-operator │ │ │ ├── combine-latest-all-operator.component.css │ │ │ ├── combine-latest-all-operator.component.html │ │ │ ├── combine-latest-all-operator.component.ts │ │ │ └── combine-latest-all-operator.component.spec.ts │ │ ├── default-if-empty-operator │ │ │ ├── default-if-empty-operator.component.css │ │ │ ├── default-if-empty-operator.component.html │ │ │ ├── default-if-empty-operator.component.ts │ │ │ └── default-if-empty-operator.component.spec.ts │ │ ├── distinct-until-key-changed │ │ │ ├── distinct-until-key-changed.component.css │ │ │ ├── distinct-until-key-changed.component.html │ │ │ └── distinct-until-key-changed.component.spec.ts │ │ ├── publish-behavior-operator │ │ │ ├── publish-behavior-operator.component.css │ │ │ ├── publish-behavior-operator.component.html │ │ │ └── publish-behavior-operator.component.spec.ts │ │ ├── with-latest-from-operator │ │ │ ├── with-latest-from-operator.component.css │ │ │ ├── with-latest-from-operator.component.html │ │ │ ├── with-latest-from-operator.component.ts │ │ │ └── with-latest-from-operator.component.spec.ts │ │ └── distinct-until-changed-operator │ │ │ ├── distinct-until-changed-operator.component.css │ │ │ ├── distinct-until-changed-operator.component.html │ │ │ └── distinct-until-changed-operator.component.spec.ts │ ├── components │ │ ├── new-observable │ │ │ ├── new-observable.component.css │ │ │ ├── new-observable.component.html │ │ │ └── new-observable.component.spec.ts │ │ ├── operators-basics │ │ │ ├── operators-basics.component.css │ │ │ ├── operators-basics.component.html │ │ │ ├── operators-basics.component.spec.ts │ │ │ └── operators-basics.component.ts │ │ ├── function-observable │ │ │ ├── function-observable.component.css │ │ │ ├── function-observable.component.html │ │ │ ├── function-observable.component.ts │ │ │ └── function-observable.component.spec.ts │ │ └── cancelling-observable │ │ │ ├── cancelling-observable.component.css │ │ │ ├── cancelling-observable.component.html │ │ │ └── cancelling-observable.component.spec.ts │ └── services │ │ ├── Observer4.ts │ │ └── Function.ts ├── favicon.ico ├── styles.css ├── environments │ ├── environment.prod.ts │ └── environment.ts ├── index.html ├── main.ts └── test.ts ├── .editorconfig ├── tsconfig.app.json ├── tsconfig.spec.json ├── .browserslistrc ├── .gitignore └── tsconfig.json /src/assets/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/app.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/subject/subject.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/operators/operators.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/map-operator/map-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/max-operator/max-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/min-operator/min-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/schedulers/schedulers.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/void-subject/void-subject.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/zip-operator/zip-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/ajax-operator/ajax-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/async-subject/async-subject.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/audit-operator/audit-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/count-operator/count-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/defer-operator/defer-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/delay-operator/delay-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/every-operator/every-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/find-operator/find-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/first-operator/first-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/last-operator/last-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/merge-operator/merge-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/race-operator/race-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/range-operator/range-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/replay-subject/replay-subject.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/retry-operator/retry-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/scan-operator/scan-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/share-operator/share-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/skip-operator/skip-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/take-operator/take-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/timer-operator/timer-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/components/new-observable/new-observable.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/behavior-subject/behavior-subject.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/buffer-operator/buffer-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/cold-observable/cold-observable.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/concat-component/concat-component.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/concat-operator/concat-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/debounce-operator/debounce-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/distinct-operator/distinct-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/filter-operator/filter-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/generate-operator/generate-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/group-by-operator/group-by-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/is-empty-operator/is-empty-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/map-to-operator/map-to-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/merge-component/merge-component.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/pairwise-operator/pairwise-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/reduce-operator/reduce-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/sample-operator/sample-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/single-operator/single-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/throttle-operator/throttle-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/to-array-operator/to-array-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/window-operator/window-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/components/operators-basics/operators-basics.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/concat-all-operator/concat-all-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/concat-map-operator/concat-map-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/element-at-operator/element-at-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/find-index-operator/find-index-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/fork-join-operator/fork-join-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/merge-all-operator/merge-all-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/merge-map-component/merge-map-component.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/merge-map-operator/merge-map-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/multicast-operator/multicast-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/observe-on-operator/observe-on-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/partition-operator/partition-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/retry-when-operator/retry-when-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/skip-last-operator/skip-last-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/skip-until-operator/skip-until-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/skip-while-operator/skip-while-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/start-with-operator/start-with-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/switch-all-operator/switch-all-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/switch-map-operator/switch-map-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/take-last-operator/take-last-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/take-until-operator/take-until-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/take-while-operator/take-while-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/components/function-observable/function-observable.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/buffer-count-operator/buffer-count-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/buffer-time-operator/buffer-time-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/buffer-toggle-operator/buffer-toggle-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/buffer-when-operator/buffer-when-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/catch-error-operator/catch-error-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/concat-map-to-operator/concat-map-to-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/dematerialize-operator/dematerialize-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/exhaust-all-operator/exhaust-all-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/exhaust-map-operator/exhaust-map-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/materialize-operator/materialize-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/merge-map-to-operator/merge-map-to-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/publish-last-operator/publish-last-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/subject/subject.component.html: -------------------------------------------------------------------------------- 1 |

subject works!

2 | -------------------------------------------------------------------------------- /src/app/pages/subscribe-on-operator/subscribe-on-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/switch-map-to-operator/switch-map-to-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/window-count-operator/window-count-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/window-time-operator/window-time-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/window-toggle-operator/window-toggle-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/window-when-operator/window-when-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/components/cancelling-observable/cancelling-observable.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/combine-latest-operator/combine-latest-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/ignore-elements-operator/ignore-elements-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/publish-replay-operator/publish-replay-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/combine-latest-all-operator/combine-latest-all-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/default-if-empty-operator/default-if-empty-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/distinct-until-key-changed/distinct-until-key-changed.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/publish-behavior-operator/publish-behavior-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/schedulers/schedulers.component.html: -------------------------------------------------------------------------------- 1 |

schedulers works!

2 | -------------------------------------------------------------------------------- /src/app/pages/with-latest-from-operator/with-latest-from-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/ajax-operator/ajax-operator.component.html: -------------------------------------------------------------------------------- 1 |

ajax-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/async-subject/async-subject.component.html: -------------------------------------------------------------------------------- 1 |

async-subject works!

2 | -------------------------------------------------------------------------------- /src/app/pages/find-operator/find-operator.component.html: -------------------------------------------------------------------------------- 1 |

find-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/last-operator/last-operator.component.html: -------------------------------------------------------------------------------- 1 |

last-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/max-operator/max-operator.component.html: -------------------------------------------------------------------------------- 1 |

max-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/min-operator/min-operator.component.html: -------------------------------------------------------------------------------- 1 |

min-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/race-operator/race-operator.component.html: -------------------------------------------------------------------------------- 1 |

race-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/scan-operator/scan-operator.component.html: -------------------------------------------------------------------------------- 1 |

scan-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/skip-operator/skip-operator.component.html: -------------------------------------------------------------------------------- 1 |

skip-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/take-operator/take-operator.component.html: -------------------------------------------------------------------------------- 1 |

take-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/void-subject/void-subject.component.html: -------------------------------------------------------------------------------- 1 |

void-subject works!

2 | -------------------------------------------------------------------------------- /src/app/pages/zip-operator/zip-operator.component.html: -------------------------------------------------------------------------------- 1 |

zip-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/audit-operator/audit-operator.component.html: -------------------------------------------------------------------------------- 1 |

audit-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/count-operator/count-operator.component.html: -------------------------------------------------------------------------------- 1 |

count-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/defer-operator/defer-operator.component.html: -------------------------------------------------------------------------------- 1 |

defer-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/delay-operator/delay-operator.component.html: -------------------------------------------------------------------------------- 1 |

delay-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/distinct-until-changed-operator/distinct-until-changed-operator.component.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/pages/every-operator/every-operator.component.html: -------------------------------------------------------------------------------- 1 |

every-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/first-operator/first-operator.component.html: -------------------------------------------------------------------------------- 1 |

first-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/merge-operator/merge-operator.component.html: -------------------------------------------------------------------------------- 1 |

merge-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/range-operator/range-operator.component.html: -------------------------------------------------------------------------------- 1 |

range-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/replay-subject/replay-subject.component.html: -------------------------------------------------------------------------------- 1 |

replay-subject works!

2 | -------------------------------------------------------------------------------- /src/app/pages/retry-operator/retry-operator.component.html: -------------------------------------------------------------------------------- 1 |

retry-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/share-operator/share-operator.component.html: -------------------------------------------------------------------------------- 1 |

share-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/timer-operator/timer-operator.component.html: -------------------------------------------------------------------------------- 1 |

timer-operator works!

2 | -------------------------------------------------------------------------------- /src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/leelanarasimha/rxjs-basics/HEAD/src/favicon.ico -------------------------------------------------------------------------------- /src/app/components/new-observable/new-observable.component.html: -------------------------------------------------------------------------------- 1 |

new-observable works!

2 | -------------------------------------------------------------------------------- /src/app/pages/behavior-subject/behavior-subject.component.html: -------------------------------------------------------------------------------- 1 |

behavior-subject works!

2 | -------------------------------------------------------------------------------- /src/app/pages/cold-observable/cold-observable.component.html: -------------------------------------------------------------------------------- 1 |

cold-observable works!

2 | -------------------------------------------------------------------------------- /src/app/pages/concat-component/concat-component.component.html: -------------------------------------------------------------------------------- 1 |

concat-component works!

2 | -------------------------------------------------------------------------------- /src/app/pages/concat-operator/concat-operator.component.html: -------------------------------------------------------------------------------- 1 |

concat-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/filter-operator/filter-operator.component.html: -------------------------------------------------------------------------------- 1 |

filter-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/map-to-operator/map-to-operator.component.html: -------------------------------------------------------------------------------- 1 |

map-to-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/merge-component/merge-component.component.html: -------------------------------------------------------------------------------- 1 |

merge-component works!

2 | -------------------------------------------------------------------------------- /src/app/pages/reduce-operator/reduce-operator.component.html: -------------------------------------------------------------------------------- 1 |

reduce-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/sample-operator/sample-operator.component.html: -------------------------------------------------------------------------------- 1 |

sample-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/single-operator/single-operator.component.html: -------------------------------------------------------------------------------- 1 |

single-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/window-operator/window-operator.component.html: -------------------------------------------------------------------------------- 1 |

window-operator works!

2 | -------------------------------------------------------------------------------- /src/styles.css: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | -------------------------------------------------------------------------------- /src/app/components/operators-basics/operators-basics.component.html: -------------------------------------------------------------------------------- 1 |

operators-basics works!

2 | -------------------------------------------------------------------------------- /src/app/pages/distinct-operator/distinct-operator.component.html: -------------------------------------------------------------------------------- 1 |

distinct-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/fork-join-operator/fork-join-operator.component.html: -------------------------------------------------------------------------------- 1 |

fork-join-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/generate-operator/generate-operator.component.html: -------------------------------------------------------------------------------- 1 |

generate-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/group-by-operator/group-by-operator.component.html: -------------------------------------------------------------------------------- 1 |

group-by-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/is-empty-operator/is-empty-operator.component.html: -------------------------------------------------------------------------------- 1 |

is-empty-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/merge-all-operator/merge-all-operator.component.html: -------------------------------------------------------------------------------- 1 |

merge-all-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/merge-map-operator/merge-map-operator.component.html: -------------------------------------------------------------------------------- 1 |

merge-map-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/multicast-operator/multicast-operator.component.html: -------------------------------------------------------------------------------- 1 |

multicast-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/pairwise-operator/pairwise-operator.component.html: -------------------------------------------------------------------------------- 1 |

pairwise-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/partition-operator/partition-operator.component.html: -------------------------------------------------------------------------------- 1 |

partition-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/skip-last-operator/skip-last-operator.component.html: -------------------------------------------------------------------------------- 1 |

skip-last-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/take-last-operator/take-last-operator.component.html: -------------------------------------------------------------------------------- 1 |

take-last-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/throttle-operator/throttle-operator.component.html: -------------------------------------------------------------------------------- 1 |

throttle-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/to-array-operator/to-array-operator.component.html: -------------------------------------------------------------------------------- 1 |

to-array-operator works!

2 | -------------------------------------------------------------------------------- /src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /src/app/pages/concat-all-operator/concat-all-operator.component.html: -------------------------------------------------------------------------------- 1 |

concat-all-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/concat-map-operator/concat-map-operator.component.html: -------------------------------------------------------------------------------- 1 |

concat-map-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/element-at-operator/element-at-operator.component.html: -------------------------------------------------------------------------------- 1 |

element-at-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/find-index-operator/find-index-operator.component.html: -------------------------------------------------------------------------------- 1 |

find-index-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/merge-map-component/merge-map-component.component.html: -------------------------------------------------------------------------------- 1 |

merge-map-component works!

2 | -------------------------------------------------------------------------------- /src/app/pages/observe-on-operator/observe-on-operator.component.html: -------------------------------------------------------------------------------- 1 |

observe-on-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/retry-when-operator/retry-when-operator.component.html: -------------------------------------------------------------------------------- 1 |

retry-when-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/skip-while-operator/skip-while-operator.component.html: -------------------------------------------------------------------------------- 1 |

skip-while-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/start-with-operator/start-with-operator.component.html: -------------------------------------------------------------------------------- 1 |

start-with-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/switch-all-operator/switch-all-operator.component.html: -------------------------------------------------------------------------------- 1 |

switch-all-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/switch-map-operator/switch-map-operator.component.html: -------------------------------------------------------------------------------- 1 |

switch-map-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/take-while-operator/take-while-operator.component.html: -------------------------------------------------------------------------------- 1 |

take-while-operator works!

2 | -------------------------------------------------------------------------------- /src/app/components/function-observable/function-observable.component.html: -------------------------------------------------------------------------------- 1 |

function-observable works!

2 | -------------------------------------------------------------------------------- /src/app/pages/buffer-count-operator/buffer-count-operator.component.html: -------------------------------------------------------------------------------- 1 |

buffer-count-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/buffer-time-operator/buffer-time-operator.component.html: -------------------------------------------------------------------------------- 1 |

buffer-time-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/buffer-when-operator/buffer-when-operator.component.html: -------------------------------------------------------------------------------- 1 |

buffer-when-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/catch-error-operator/catch-error-operator.component.html: -------------------------------------------------------------------------------- 1 |

catch-error-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/exhaust-all-operator/exhaust-all-operator.component.html: -------------------------------------------------------------------------------- 1 |

exhaust-all-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/exhaust-map-operator/exhaust-map-operator.component.html: -------------------------------------------------------------------------------- 1 |

exhaust-map-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/materialize-operator/materialize-operator.component.html: -------------------------------------------------------------------------------- 1 |

materialize-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/merge-map-to-operator/merge-map-to-operator.component.html: -------------------------------------------------------------------------------- 1 |

merge-map-to-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/publish-last-operator/publish-last-operator.component.html: -------------------------------------------------------------------------------- 1 |

publish-last-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/subscribe-on-operator/subscribe-on-operator.component.html: -------------------------------------------------------------------------------- 1 |

subscribe-on-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/window-count-operator/window-count-operator.component.html: -------------------------------------------------------------------------------- 1 |

window-count-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/window-time-operator/window-time-operator.component.html: -------------------------------------------------------------------------------- 1 |

window-time-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/window-when-operator/window-when-operator.component.html: -------------------------------------------------------------------------------- 1 |

window-when-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/buffer-toggle-operator/buffer-toggle-operator.component.html: -------------------------------------------------------------------------------- 1 |

buffer-toggle-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/combine-latest-operator/combine-latest-operator.component.html: -------------------------------------------------------------------------------- 1 |

combine-latest-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/concat-map-to-operator/concat-map-to-operator.component.html: -------------------------------------------------------------------------------- 1 |

concat-map-to-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/dematerialize-operator/dematerialize-operator.component.html: -------------------------------------------------------------------------------- 1 |

dematerialize-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/publish-replay-operator/publish-replay-operator.component.html: -------------------------------------------------------------------------------- 1 |

publish-replay-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/switch-map-to-operator/switch-map-to-operator.component.html: -------------------------------------------------------------------------------- 1 |

switch-map-to-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/window-toggle-operator/window-toggle-operator.component.html: -------------------------------------------------------------------------------- 1 |

window-toggle-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/ignore-elements-operator/ignore-elements-operator.component.html: -------------------------------------------------------------------------------- 1 |

ignore-elements-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/default-if-empty-operator/default-if-empty-operator.component.html: -------------------------------------------------------------------------------- 1 |

default-if-empty-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/distinct-until-key-changed/distinct-until-key-changed.component.html: -------------------------------------------------------------------------------- 1 |

distinct-until-key-changed works!

2 | -------------------------------------------------------------------------------- /src/app/pages/publish-behavior-operator/publish-behavior-operator.component.html: -------------------------------------------------------------------------------- 1 |

publish-behavior-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/with-latest-from-operator/with-latest-from-operator.component.html: -------------------------------------------------------------------------------- 1 |

with-latest-from-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/combine-latest-all-operator/combine-latest-all-operator.component.html: -------------------------------------------------------------------------------- 1 |

combine-latest-all-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/distinct-until-changed-operator/distinct-until-changed-operator.component.html: -------------------------------------------------------------------------------- 1 |

distinct-until-changed-operator works!

2 | -------------------------------------------------------------------------------- /src/app/pages/debounce-operator/debounce-operator.component.html: -------------------------------------------------------------------------------- 1 |

debounce-operator works!

2 | 3 | 4 | -------------------------------------------------------------------------------- /src/app/pages/map-operator/map-operator.component.html: -------------------------------------------------------------------------------- 1 |

map-operator works!

2 | 3 |
4 | 5 |
6 | -------------------------------------------------------------------------------- /src/app/components/cancelling-observable/cancelling-observable.component.html: -------------------------------------------------------------------------------- 1 |

cancelling-observable works!

2 | 3 | 4 | 5 |
{{ timer }}
6 | -------------------------------------------------------------------------------- /src/app/pages/skip-until-operator/skip-until-operator.component.html: -------------------------------------------------------------------------------- 1 |

skip-until-operator works!

2 | 3 |
4 | 5 |
6 | 7 |
{{ number }}
8 | -------------------------------------------------------------------------------- /src/app/pages/take-until-operator/take-until-operator.component.html: -------------------------------------------------------------------------------- 1 |

take-until-operator works!

2 | 3 |
4 | 5 |
6 |
7 | 8 |
9 | -------------------------------------------------------------------------------- /src/app/pages/buffer-operator/buffer-operator.component.html: -------------------------------------------------------------------------------- 1 |
2 |
3 | 4 |
5 | 6 |
7 |
{{ data }}
8 |
9 | -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.ts] 12 | quote_type = single 13 | 14 | [*.md] 15 | max_line_length = off 16 | trim_trailing_whitespace = false 17 | -------------------------------------------------------------------------------- /src/app/services/Observer4.ts: -------------------------------------------------------------------------------- 1 | import { Observer } from 'rxjs'; 2 | 3 | export class Observer4 implements Observer { 4 | next(data: number) { 5 | console.log('observer 4 ' + data); 6 | } 7 | 8 | error(error: string) { 9 | console.log(error); 10 | } 11 | 12 | complete() { 13 | console.log('complete done by class'); 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | RxjsBasics 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /tsconfig.app.json: -------------------------------------------------------------------------------- 1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */ 2 | { 3 | "extends": "./tsconfig.json", 4 | "compilerOptions": { 5 | "outDir": "./out-tsc/app", 6 | "types": [] 7 | }, 8 | "files": [ 9 | "src/main.ts", 10 | "src/polyfills.ts" 11 | ], 12 | "include": [ 13 | "src/**/*.d.ts" 14 | ] 15 | } 16 | -------------------------------------------------------------------------------- /src/app/pages/operators/operators.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-operators', 5 | templateUrl: './operators.component.html', 6 | styleUrls: ['./operators.component.css'], 7 | }) 8 | export class OperatorsComponent implements OnInit { 9 | constructor() {} 10 | 11 | ngOnInit(): void {} 12 | } 13 | -------------------------------------------------------------------------------- /tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */ 2 | { 3 | "extends": "./tsconfig.json", 4 | "compilerOptions": { 5 | "outDir": "./out-tsc/spec", 6 | "types": [ 7 | "jasmine" 8 | ] 9 | }, 10 | "files": [ 11 | "src/test.ts", 12 | "src/polyfills.ts" 13 | ], 14 | "include": [ 15 | "src/**/*.spec.ts", 16 | "src/**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /src/main.ts: -------------------------------------------------------------------------------- 1 | import { enableProdMode } from '@angular/core'; 2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 3 | 4 | import { AppModule } from './app/app.module'; 5 | import { environment } from './environments/environment'; 6 | 7 | if (environment.production) { 8 | enableProdMode(); 9 | } 10 | 11 | platformBrowserDynamic() 12 | .bootstrapModule(AppModule) 13 | .catch((err) => console.error(err)); 14 | -------------------------------------------------------------------------------- /src/app/services/Function.ts: -------------------------------------------------------------------------------- 1 | import { observable, Observable } from 'rxjs'; 2 | 3 | export function functionObs() { 4 | console.log('function call'); 5 | return '1'; 6 | return '2'; //dead code 7 | } 8 | 9 | export const funcObservable = new Observable((observer) => { 10 | console.log('observable call'); 11 | observer.next('1'); 12 | observer.next('2'); 13 | setTimeout(() => { 14 | observer.next('3'); 15 | }, 2000); 16 | }); 17 | -------------------------------------------------------------------------------- /src/app/components/function-observable/function-observable.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-function-observable', 5 | templateUrl: './function-observable.component.html', 6 | styleUrls: ['./function-observable.component.css'] 7 | }) 8 | export class FunctionObservableComponent implements OnInit { 9 | 10 | constructor() { } 11 | 12 | ngOnInit(): void { 13 | } 14 | 15 | } 16 | -------------------------------------------------------------------------------- /src/app/pages/delay-operator/delay-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { concatMap, delay, of } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-delay-operator', 6 | templateUrl: './delay-operator.component.html', 7 | styleUrls: ['./delay-operator.component.css'], 8 | }) 9 | export class DelayOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source$ = of(1, 2, 3, 4); 14 | 15 | source$.pipe(delay(2000)).subscribe((data) => { 16 | console.log(data); 17 | }); 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /src/app/pages/every-operator/every-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { of, every } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-every-operator', 6 | templateUrl: './every-operator.component.html', 7 | styleUrls: ['./every-operator.component.css'], 8 | }) 9 | export class EveryOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source$ = of(1, 2, 3, 4, 5, 6); 14 | 15 | source$.pipe(every((val) => val < 7)).subscribe((data) => { 16 | console.log(data); 17 | }); 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /src/app/pages/count-operator/count-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { count, of } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-count-operator', 6 | templateUrl: './count-operator.component.html', 7 | styleUrls: ['./count-operator.component.css'], 8 | }) 9 | export class CountOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source$ = of(1, 2, 3, 4, 5, 6, 7); 14 | 15 | source$.pipe(count((val, index) => val > 6)).subscribe((data) => { 16 | console.log(data); 17 | }); 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /src/app/pages/to-array-operator/to-array-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { of, take, toArray } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-to-array-operator', 6 | templateUrl: './to-array-operator.component.html', 7 | styleUrls: ['./to-array-operator.component.css'], 8 | }) 9 | export class ToArrayOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source$ = of(1, 2, 3, 4, 5); 14 | source$.pipe(take(3), toArray()).subscribe((data) => { 15 | console.log(data); 16 | }); 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /src/app/pages/map-to-operator/map-to-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { interval } from 'rxjs'; 3 | import { mapTo } from 'rxjs/operators'; 4 | 5 | @Component({ 6 | selector: 'app-map-to-operator', 7 | templateUrl: './map-to-operator.component.html', 8 | styleUrls: ['./map-to-operator.component.css'], 9 | }) 10 | export class MapToOperatorComponent implements OnInit { 11 | constructor() {} 12 | 13 | ngOnInit(): void { 14 | interval(500) 15 | .pipe(mapTo('LeelaWebDev')) 16 | .subscribe((data) => { 17 | console.log(data); 18 | }); 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /src/app/pages/sample-operator/sample-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { interval } from 'rxjs'; 3 | import { sample } from 'rxjs/operators'; 4 | 5 | @Component({ 6 | selector: 'app-sample-operator', 7 | templateUrl: './sample-operator.component.html', 8 | styleUrls: ['./sample-operator.component.css'], 9 | }) 10 | export class SampleOperatorComponent implements OnInit { 11 | constructor() {} 12 | 13 | ngOnInit(): void { 14 | interval(500) 15 | .pipe(sample(interval(1000))) 16 | .subscribe((data) => { 17 | console.log(data); 18 | }); 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /src/app/pages/start-with-operator/start-with-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { interval, startWith } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-start-with-operator', 6 | templateUrl: './start-with-operator.component.html', 7 | styleUrls: ['./start-with-operator.component.css'], 8 | }) 9 | export class StartWithOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source$ = interval(1000); 14 | 15 | source$.pipe(startWith(...[10, 20, 30])).subscribe((data) => { 16 | console.log(data); 17 | }); 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /src/app/pages/default-if-empty-operator/default-if-empty-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { defaultIfEmpty, of } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-default-if-empty-operator', 6 | templateUrl: './default-if-empty-operator.component.html', 7 | styleUrls: ['./default-if-empty-operator.component.css'], 8 | }) 9 | export class DefaultIfEmptyOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source$ = of(); 14 | 15 | source$.pipe(defaultIfEmpty(40)).subscribe((data) => { 16 | console.log(data); 17 | }); 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /src/app/pages/element-at-operator/element-at-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { of } from 'rxjs'; 3 | import { elementAt } from 'rxjs/operators'; 4 | 5 | @Component({ 6 | selector: 'app-element-at-operator', 7 | templateUrl: './element-at-operator.component.html', 8 | styleUrls: ['./element-at-operator.component.css'], 9 | }) 10 | export class ElementAtOperatorComponent implements OnInit { 11 | constructor() {} 12 | 13 | ngOnInit(): void { 14 | of(1, 2, 3, 4, 5) 15 | .pipe(elementAt(-1, 10)) 16 | .subscribe((data) => { 17 | console.log(data); 18 | }); 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /src/app/pages/take-last-operator/take-last-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { interval } from 'rxjs'; 3 | import { take, takeLast } from 'rxjs/operators'; 4 | 5 | @Component({ 6 | selector: 'app-take-last-operator', 7 | templateUrl: './take-last-operator.component.html', 8 | styleUrls: ['./take-last-operator.component.css'], 9 | }) 10 | export class TakeLastOperatorComponent implements OnInit { 11 | constructor() {} 12 | 13 | ngOnInit(): void { 14 | interval(500) 15 | .pipe(take(10), takeLast(5)) 16 | .subscribe((data) => { 17 | console.log(data); 18 | }); 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /src/app/pages/skip-while-operator/skip-while-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { of } from 'rxjs'; 3 | import { skipWhile } from 'rxjs/operators'; 4 | 5 | @Component({ 6 | selector: 'app-skip-while-operator', 7 | templateUrl: './skip-while-operator.component.html', 8 | styleUrls: ['./skip-while-operator.component.css'], 9 | }) 10 | export class SkipWhileOperatorComponent implements OnInit { 11 | constructor() {} 12 | 13 | ngOnInit(): void { 14 | of(1, 2, 3, 4, 5, 1, 2) 15 | .pipe(skipWhile((x) => x < 3)) 16 | .subscribe((data) => { 17 | console.log(data); 18 | }); 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /src/app/pages/buffer-time-operator/buffer-time-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { interval } from 'rxjs'; 3 | import { bufferTime } from 'rxjs/operators'; 4 | 5 | @Component({ 6 | selector: 'app-buffer-time-operator', 7 | templateUrl: './buffer-time-operator.component.html', 8 | styleUrls: ['./buffer-time-operator.component.css'], 9 | }) 10 | export class BufferTimeOperatorComponent implements OnInit { 11 | constructor() {} 12 | 13 | ngOnInit(): void { 14 | interval(1000) 15 | .pipe(bufferTime(2000, 1000)) 16 | .subscribe((data) => { 17 | console.log(data); 18 | }); 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /src/app/pages/range-operator/range-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { asyncScheduler, range } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-range-operator', 6 | templateUrl: './range-operator.component.html', 7 | styleUrls: ['./range-operator.component.css'], 8 | }) 9 | export class RangeOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | console.log('start Scripting'); 14 | let source$ = range(4, 1000, asyncScheduler); 15 | 16 | source$.subscribe((data) => { 17 | console.log(data); 18 | }); 19 | console.log('end Scripting'); 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /src/app/pages/with-latest-from-operator/with-latest-from-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { interval, withLatestFrom } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-with-latest-from-operator', 6 | templateUrl: './with-latest-from-operator.component.html', 7 | styleUrls: ['./with-latest-from-operator.component.css'], 8 | }) 9 | export class WithLatestFromOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source$ = interval(1000); 14 | 15 | source$.pipe(withLatestFrom(interval(100))).subscribe((data) => { 16 | console.log(data); 17 | }); 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /src/app/pages/switch-map-to-operator/switch-map-to-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { interval, of } from 'rxjs'; 3 | import { switchMapTo, take } from 'rxjs/operators'; 4 | 5 | @Component({ 6 | selector: 'app-switch-map-to-operator', 7 | templateUrl: './switch-map-to-operator.component.html', 8 | styleUrls: ['./switch-map-to-operator.component.css'], 9 | }) 10 | export class SwitchMapToOperatorComponent implements OnInit { 11 | constructor() {} 12 | 13 | ngOnInit(): void { 14 | interval(50) 15 | .pipe(switchMapTo(interval(10)), take(10)) 16 | .subscribe((data) => { 17 | console.log(data); 18 | }); 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /src/app/pages/find-operator/find-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { find, first, of } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-find-operator', 6 | templateUrl: './find-operator.component.html', 7 | styleUrls: ['./find-operator.component.css'], 8 | }) 9 | export class FindOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source$ = of(1, 2, 3, 10, 3, 20); 14 | 15 | source$.pipe(find((val) => val > 20)).subscribe((data) => { 16 | console.log(data); 17 | }); 18 | 19 | source$.pipe(first((val) => val > 20)).subscribe((data) => { 20 | console.log(data); 21 | }); 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /src/app/pages/window-operator/window-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { buffer, interval, mergeMap, toArray, window } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-window-operator', 6 | templateUrl: './window-operator.component.html', 7 | styleUrls: ['./window-operator.component.css'], 8 | }) 9 | export class WindowOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source$ = interval(500); 14 | source$ 15 | .pipe( 16 | window(interval(2000)), 17 | mergeMap((val) => val.pipe(toArray())) 18 | ) 19 | .subscribe((data) => { 20 | console.log(data); 21 | }); 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /src/app/pages/concat-all-operator/concat-all-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { concatAll, interval, map, of, take } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-concat-all-operator', 6 | templateUrl: './concat-all-operator.component.html', 7 | styleUrls: ['./concat-all-operator.component.css'], 8 | }) 9 | export class ConcatAllOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source$ = of(10, 2, 4); 14 | source$ 15 | .pipe( 16 | map((value) => interval(500).pipe(take(value))), 17 | concatAll() 18 | ) 19 | .subscribe((data) => { 20 | console.log(data); 21 | }); 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /src/environments/environment.ts: -------------------------------------------------------------------------------- 1 | // This file can be replaced during build by using the `fileReplacements` array. 2 | // `ng build` replaces `environment.ts` with `environment.prod.ts`. 3 | // The list of file replacements can be found in `angular.json`. 4 | 5 | export const environment = { 6 | production: false 7 | }; 8 | 9 | /* 10 | * For easier debugging in development mode, you can import the following file 11 | * to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`. 12 | * 13 | * This import should be commented out in production mode because it will have a negative impact 14 | * on performance if an error is thrown. 15 | */ 16 | // import 'zone.js/plugins/zone-error'; // Included with Angular CLI. 17 | -------------------------------------------------------------------------------- /src/app/pages/throttle-operator/throttle-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { interval } from 'rxjs'; 3 | import { throttle } from 'rxjs/operators'; 4 | 5 | @Component({ 6 | selector: 'app-throttle-operator', 7 | templateUrl: './throttle-operator.component.html', 8 | styleUrls: ['./throttle-operator.component.css'], 9 | }) 10 | export class ThrottleOperatorComponent implements OnInit { 11 | constructor() {} 12 | 13 | ngOnInit(): void { 14 | interval(1000) 15 | .pipe( 16 | throttle((value) => interval(2000), { leading: true, trailing: false }) 17 | ) 18 | .subscribe((data) => { 19 | console.log(data); 20 | }); 21 | 22 | //output : 0, 2, 4,6 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /src/app/pages/zip-operator/zip-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { of, zip } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-zip-operator', 6 | templateUrl: './zip-operator.component.html', 7 | styleUrls: ['./zip-operator.component.css'], 8 | }) 9 | export class ZipOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source1$ = of(1, 2, 3, 4, 5); 14 | let source2$ = of('a', 'b', 'c', 'd', 'e'); 15 | let source3$ = of(100, 200, 300, 400, 500); 16 | 17 | zip([source1$, source2$, source3$], (a, b, c) => { 18 | return a + ',' + b + ',' + c; 19 | }).subscribe((data) => { 20 | console.log(data); 21 | }); 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /src/app/pages/window-time-operator/window-time-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { interval, mergeMap, toArray, windowTime } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-window-time-operator', 6 | templateUrl: './window-time-operator.component.html', 7 | styleUrls: ['./window-time-operator.component.css'], 8 | }) 9 | export class WindowTimeOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source$ = interval(500); 14 | 15 | source$ 16 | .pipe( 17 | windowTime(2000, 5000), 18 | mergeMap((val) => val.pipe(toArray())) 19 | ) 20 | .subscribe((data) => { 21 | console.log(data); 22 | }); 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /src/app/pages/buffer-count-operator/buffer-count-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { interval, of } from 'rxjs'; 3 | import { bufferCount } from 'rxjs/operators'; 4 | 5 | @Component({ 6 | selector: 'app-buffer-count-operator', 7 | templateUrl: './buffer-count-operator.component.html', 8 | styleUrls: ['./buffer-count-operator.component.css'], 9 | }) 10 | export class BufferCountOperatorComponent implements OnInit { 11 | constructor() {} 12 | 13 | ngOnInit(): void { 14 | // interval(1000) 15 | // .pipe(bufferCount(3)) 16 | // .subscribe((data) => console.log(data)); 17 | 18 | interval(1000) 19 | .pipe(bufferCount(3, 2)) 20 | .subscribe((data) => console.log(data)); 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /src/app/pages/window-when-operator/window-when-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { interval, mergeMap, toArray, windowWhen } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-window-when-operator', 6 | templateUrl: './window-when-operator.component.html', 7 | styleUrls: ['./window-when-operator.component.css'], 8 | }) 9 | export class WindowWhenOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source$ = interval(500); 14 | 15 | source$ 16 | .pipe( 17 | windowWhen(() => interval(2000)), 18 | mergeMap((val) => val.pipe(toArray())) 19 | ) 20 | .subscribe((data) => { 21 | console.log(data); 22 | }); 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /.browserslistrc: -------------------------------------------------------------------------------- 1 | # This file is used by the build system to adjust CSS and JS output to support the specified browsers below. 2 | # For additional information regarding the format and rule options, please see: 3 | # https://github.com/browserslist/browserslist#queries 4 | 5 | # For the full list of supported browsers by the Angular framework, please see: 6 | # https://angular.io/guide/browser-support 7 | 8 | # You can see what browsers were selected by your queries by running: 9 | # npx browserslist 10 | 11 | last 1 Chrome version 12 | last 1 Firefox version 13 | last 2 Edge major versions 14 | last 2 Safari major versions 15 | last 2 iOS major versions 16 | Firefox ESR 17 | not IE 11 # Angular supports IE 11 only as an opt-in. To opt-in, remove the 'not' prefix on this line. 18 | -------------------------------------------------------------------------------- /src/app/pages/find-index-operator/find-index-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { findIndex, first, of } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-find-index-operator', 6 | templateUrl: './find-index-operator.component.html', 7 | styleUrls: ['./find-index-operator.component.css'], 8 | }) 9 | export class FindIndexOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source$ = of(121, 1, 2, 13, 3, 4, 10, 5, 12); 14 | 15 | source$.pipe(findIndex((val) => val > 200)).subscribe((data) => { 16 | console.log(data); 17 | }); 18 | 19 | source$.pipe(first((val) => val > 200)).subscribe((data) => { 20 | console.log(data); 21 | }); 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /src/app/pages/subject/subject.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { SubjectComponent } from './subject.component'; 4 | 5 | describe('SubjectComponent', () => { 6 | let component: SubjectComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ SubjectComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(SubjectComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/window-count-operator/window-count-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { bufferCount, interval, mergeMap, toArray, windowCount } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-window-count-operator', 6 | templateUrl: './window-count-operator.component.html', 7 | styleUrls: ['./window-count-operator.component.css'], 8 | }) 9 | export class WindowCountOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source$ = interval(500); 14 | 15 | source$ 16 | .pipe( 17 | windowCount(3, 1), 18 | mergeMap((val) => val.pipe(toArray())) 19 | ) 20 | .subscribe((data) => { 21 | console.log(data); 22 | }); 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /src/app/pages/pairwise-operator/pairwise-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { of, pairwise } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-pairwise-operator', 6 | templateUrl: './pairwise-operator.component.html', 7 | styleUrls: ['./pairwise-operator.component.css'], 8 | }) 9 | export class PairwiseOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source$ = of(1, 2); 14 | 15 | source$.pipe(pairwise()).subscribe({ 16 | next: (data) => { 17 | console.log(data); 18 | }, 19 | error: (error) => { 20 | console.log(error); 21 | }, 22 | complete: () => { 23 | console.log('complete'); 24 | }, 25 | }); 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /src/app/pages/take-operator/take-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { interval } from 'rxjs'; 3 | import { take } from 'rxjs/operators'; 4 | 5 | @Component({ 6 | selector: 'app-take-operator', 7 | templateUrl: './take-operator.component.html', 8 | styleUrls: ['./take-operator.component.css'], 9 | }) 10 | export class TakeOperatorComponent implements OnInit { 11 | constructor() {} 12 | 13 | ngOnInit(): void { 14 | interval(500) 15 | .pipe(take(5)) 16 | .subscribe( 17 | (data) => { 18 | console.log(data); 19 | }, 20 | (error) => { 21 | console.log(error); 22 | }, 23 | () => { 24 | console.log('complete'); 25 | } 26 | ); 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /src/app/pages/operators/operators.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { OperatorsComponent } from './operators.component'; 4 | 5 | describe('OperatorsComponent', () => { 6 | let component: OperatorsComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ OperatorsComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(OperatorsComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/skip-operator/skip-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { interval, of } from 'rxjs'; 3 | import { skip, take } from 'rxjs/operators'; 4 | 5 | @Component({ 6 | selector: 'app-skip-operator', 7 | templateUrl: './skip-operator.component.html', 8 | styleUrls: ['./skip-operator.component.css'], 9 | }) 10 | export class SkipOperatorComponent implements OnInit { 11 | constructor() {} 12 | 13 | ngOnInit(): void { 14 | of(1, 2, 3) 15 | .pipe(skip(5)) 16 | .subscribe( 17 | (data) => { 18 | console.log(data); 19 | }, 20 | (error) => { 21 | console.log(error); 22 | }, 23 | () => { 24 | console.log('complete'); 25 | } 26 | ); 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /src/app/pages/audit-operator/audit-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { interval } from 'rxjs'; 3 | import { audit } from 'rxjs/operators'; 4 | 5 | @Component({ 6 | selector: 'app-audit-operator', 7 | templateUrl: './audit-operator.component.html', 8 | styleUrls: ['./audit-operator.component.css'], 9 | }) 10 | export class AuditOperatorComponent implements OnInit { 11 | constructor() {} 12 | 13 | ngOnInit(): void { 14 | interval(1000) 15 | .pipe(audit((val) => interval(2000))) 16 | .subscribe((data) => { 17 | console.log(data); 18 | }); 19 | 20 | //output: 2, 5, 8 21 | 22 | // 0 -> audit -> interval -> 2000 23 | // 3 -> audit -> interval -> 2000 24 | // 6 -> audit -> interval -> 2000 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /src/app/pages/fork-join-operator/fork-join-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { forkJoin, Observable, of } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-fork-join-operator', 6 | templateUrl: './fork-join-operator.component.html', 7 | styleUrls: ['./fork-join-operator.component.css'], 8 | }) 9 | export class ForkJoinOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source1$ = new Observable((observer) => { 14 | observer.next(1); 15 | observer.next(2); 16 | observer.error(); 17 | }); 18 | 19 | let source2$ = of('a', 'b'); 20 | 21 | forkJoin({ source1: source1$, source2: source2$ }).subscribe((data) => { 22 | console.log(data); 23 | }); 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /src/app/pages/schedulers/schedulers.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { SchedulersComponent } from './schedulers.component'; 4 | 5 | describe('SchedulersComponent', () => { 6 | let component: SchedulersComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ SchedulersComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(SchedulersComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/window-toggle-operator/window-toggle-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { interval, mergeMap, toArray, windowToggle } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-window-toggle-operator', 6 | templateUrl: './window-toggle-operator.component.html', 7 | styleUrls: ['./window-toggle-operator.component.css'], 8 | }) 9 | export class WindowToggleOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source$ = interval(500); 14 | 15 | source$ 16 | .pipe( 17 | windowToggle(interval(1000), () => interval(2000)), 18 | mergeMap((val) => val.pipe(toArray())) 19 | ) 20 | .subscribe((data) => { 21 | console.log(data); 22 | }); 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # See http://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # compiled output 4 | /dist 5 | /tmp 6 | /out-tsc 7 | # Only exists if Bazel was run 8 | /bazel-out 9 | 10 | # dependencies 11 | /node_modules 12 | 13 | # profiling files 14 | chrome-profiler-events*.json 15 | 16 | # IDEs and editors 17 | /.idea 18 | .project 19 | .classpath 20 | .c9/ 21 | *.launch 22 | .settings/ 23 | *.sublime-workspace 24 | 25 | # IDE - VSCode 26 | .vscode/* 27 | !.vscode/settings.json 28 | !.vscode/tasks.json 29 | !.vscode/launch.json 30 | !.vscode/extensions.json 31 | .history/* 32 | 33 | # misc 34 | /.sass-cache 35 | /connect.lock 36 | /coverage 37 | /libpeerconnection.log 38 | npm-debug.log 39 | yarn-error.log 40 | testem.log 41 | /typings 42 | 43 | # System Files 44 | .DS_Store 45 | Thumbs.db 46 | -------------------------------------------------------------------------------- /src/app/pages/map-operator/map-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { MapOperatorComponent } from './map-operator.component'; 4 | 5 | describe('MapOperatorComponent', () => { 6 | let component: MapOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ MapOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(MapOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/max-operator/max-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { MaxOperatorComponent } from './max-operator.component'; 4 | 5 | describe('MaxOperatorComponent', () => { 6 | let component: MaxOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ MaxOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(MaxOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/min-operator/min-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { MinOperatorComponent } from './min-operator.component'; 4 | 5 | describe('MinOperatorComponent', () => { 6 | let component: MinOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ MinOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(MinOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/single-operator/single-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { of } from 'rxjs'; 3 | import { single } from 'rxjs/operators'; 4 | 5 | @Component({ 6 | selector: 'app-single-operator', 7 | templateUrl: './single-operator.component.html', 8 | styleUrls: ['./single-operator.component.css'], 9 | }) 10 | export class SingleOperatorComponent implements OnInit { 11 | constructor() {} 12 | 13 | ngOnInit(): void { 14 | of(1, 2, 3, 4) 15 | .pipe(single((value) => value > 5)) 16 | .subscribe( 17 | (data) => { 18 | console.log(data); 19 | }, 20 | (error) => { 21 | console.log(error); 22 | }, 23 | () => { 24 | console.log('complete'); 25 | } 26 | ); 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /src/app/pages/void-subject/void-subject.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { VoidSubjectComponent } from './void-subject.component'; 4 | 5 | describe('VoidSubjectComponent', () => { 6 | let component: VoidSubjectComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ VoidSubjectComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(VoidSubjectComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/zip-operator/zip-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { ZipOperatorComponent } from './zip-operator.component'; 4 | 5 | describe('ZipOperatorComponent', () => { 6 | let component: ZipOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ ZipOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(ZipOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/subscribe-on-operator/subscribe-on-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { asyncScheduler, merge, of, subscribeOn } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-subscribe-on-operator', 6 | templateUrl: './subscribe-on-operator.component.html', 7 | styleUrls: ['./subscribe-on-operator.component.css'], 8 | }) 9 | export class SubscribeOnOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | console.log('start scrpting'); 14 | let source$ = of(1, 2, 3, 4, 5).pipe(subscribeOn(asyncScheduler)); 15 | let source2$ = of(10, 20, 30, 40, 50); 16 | 17 | merge(source2$, source$).subscribe((data) => { 18 | console.log(data); 19 | }); 20 | 21 | console.log('end scripting'); 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /src/app/pages/ajax-operator/ajax-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { AjaxOperatorComponent } from './ajax-operator.component'; 4 | 5 | describe('AjaxOperatorComponent', () => { 6 | let component: AjaxOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ AjaxOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(AjaxOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/async-subject/async-subject.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { AsyncSubjectComponent } from './async-subject.component'; 4 | 5 | describe('AsyncSubjectComponent', () => { 6 | let component: AsyncSubjectComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ AsyncSubjectComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(AsyncSubjectComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/behavior-subject/behavior-subject.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { BehaviorSubject, Subject } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-behavior-subject', 6 | templateUrl: './behavior-subject.component.html', 7 | styleUrls: ['./behavior-subject.component.css'], 8 | }) 9 | export class BehaviorSubjectComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let behaviorSubject$ = new BehaviorSubject(0); 14 | 15 | behaviorSubject$.subscribe((data) => { 16 | console.log('observer 1' + data); 17 | }); 18 | 19 | behaviorSubject$.next(1); // 20 | 21 | behaviorSubject$.subscribe((data) => { 22 | console.log('observer 2' + data); 23 | }); 24 | 25 | behaviorSubject$.next(2); 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /src/app/pages/find-operator/find-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { FindOperatorComponent } from './find-operator.component'; 4 | 5 | describe('FindOperatorComponent', () => { 6 | let component: FindOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ FindOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(FindOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/last-operator/last-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { LastOperatorComponent } from './last-operator.component'; 4 | 5 | describe('LastOperatorComponent', () => { 6 | let component: LastOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ LastOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(LastOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/race-operator/race-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { RaceOperatorComponent } from './race-operator.component'; 4 | 5 | describe('RaceOperatorComponent', () => { 6 | let component: RaceOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ RaceOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(RaceOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/scan-operator/scan-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { ScanOperatorComponent } from './scan-operator.component'; 4 | 5 | describe('ScanOperatorComponent', () => { 6 | let component: ScanOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ ScanOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(ScanOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/skip-operator/skip-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { SkipOperatorComponent } from './skip-operator.component'; 4 | 5 | describe('SkipOperatorComponent', () => { 6 | let component: SkipOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ SkipOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(SkipOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/take-operator/take-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { TakeOperatorComponent } from './take-operator.component'; 4 | 5 | describe('TakeOperatorComponent', () => { 6 | let component: TakeOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ TakeOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(TakeOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/audit-operator/audit-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { AuditOperatorComponent } from './audit-operator.component'; 4 | 5 | describe('AuditOperatorComponent', () => { 6 | let component: AuditOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ AuditOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(AuditOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/count-operator/count-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { CountOperatorComponent } from './count-operator.component'; 4 | 5 | describe('CountOperatorComponent', () => { 6 | let component: CountOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ CountOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(CountOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/defer-operator/defer-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { DeferOperatorComponent } from './defer-operator.component'; 4 | 5 | describe('DeferOperatorComponent', () => { 6 | let component: DeferOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ DeferOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(DeferOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/delay-operator/delay-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { DelayOperatorComponent } from './delay-operator.component'; 4 | 5 | describe('DelayOperatorComponent', () => { 6 | let component: DelayOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ DelayOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(DelayOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/every-operator/every-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { EveryOperatorComponent } from './every-operator.component'; 4 | 5 | describe('EveryOperatorComponent', () => { 6 | let component: EveryOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ EveryOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(EveryOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/first-operator/first-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { FirstOperatorComponent } from './first-operator.component'; 4 | 5 | describe('FirstOperatorComponent', () => { 6 | let component: FirstOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ FirstOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(FirstOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/merge-operator/merge-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { MergeOperatorComponent } from './merge-operator.component'; 4 | 5 | describe('MergeOperatorComponent', () => { 6 | let component: MergeOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ MergeOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(MergeOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/race-operator/race-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { interval, map, race, tap } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-race-operator', 6 | templateUrl: './race-operator.component.html', 7 | styleUrls: ['./race-operator.component.css'], 8 | }) 9 | export class RaceOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source1$ = interval(1000).pipe(map((v) => 'first one ' + v)); 14 | let source2$ = interval(3000).pipe( 15 | tap((v) => { 16 | throw 'error'; 17 | }) 18 | ); 19 | let source3$ = interval(5000).pipe(map((v) => 'third one ' + v)); 20 | 21 | race(source1$, source3$, source2$).subscribe((data) => { 22 | console.log(data); 23 | }); 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /src/app/pages/range-operator/range-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { RangeOperatorComponent } from './range-operator.component'; 4 | 5 | describe('RangeOperatorComponent', () => { 6 | let component: RangeOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ RangeOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(RangeOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/replay-subject/replay-subject.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { ReplaySubjectComponent } from './replay-subject.component'; 4 | 5 | describe('ReplaySubjectComponent', () => { 6 | let component: ReplaySubjectComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ ReplaySubjectComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(ReplaySubjectComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/retry-operator/retry-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { RetryOperatorComponent } from './retry-operator.component'; 4 | 5 | describe('RetryOperatorComponent', () => { 6 | let component: RetryOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ RetryOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(RetryOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/share-operator/share-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { ShareOperatorComponent } from './share-operator.component'; 4 | 5 | describe('ShareOperatorComponent', () => { 6 | let component: ShareOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ ShareOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(ShareOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/timer-operator/timer-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { TimerOperatorComponent } from './timer-operator.component'; 4 | 5 | describe('TimerOperatorComponent', () => { 6 | let component: TimerOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ TimerOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(TimerOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/components/new-observable/new-observable.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { NewObservableComponent } from './new-observable.component'; 4 | 5 | describe('NewObservableComponent', () => { 6 | let component: NewObservableComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ NewObservableComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(NewObservableComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/map-to-operator/map-to-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { MapToOperatorComponent } from './map-to-operator.component'; 4 | 5 | describe('MapToOperatorComponent', () => { 6 | let component: MapToOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ MapToOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(MapToOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/buffer-operator/buffer-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { BufferOperatorComponent } from './buffer-operator.component'; 4 | 5 | describe('BufferOperatorComponent', () => { 6 | let component: BufferOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ BufferOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(BufferOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/cold-observable/cold-observable.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { ColdObservableComponent } from './cold-observable.component'; 4 | 5 | describe('ColdObservableComponent', () => { 6 | let component: ColdObservableComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ ColdObservableComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(ColdObservableComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/concat-operator/concat-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { ConcatOperatorComponent } from './concat-operator.component'; 4 | 5 | describe('ConcatOperatorComponent', () => { 6 | let component: ConcatOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ ConcatOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(ConcatOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/filter-operator/filter-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { FilterOperatorComponent } from './filter-operator.component'; 4 | 5 | describe('FilterOperatorComponent', () => { 6 | let component: FilterOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ FilterOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(FilterOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/merge-component/merge-component.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { MergeComponentComponent } from './merge-component.component'; 4 | 5 | describe('MergeComponentComponent', () => { 6 | let component: MergeComponentComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ MergeComponentComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(MergeComponentComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/reduce-operator/reduce-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { ReduceOperatorComponent } from './reduce-operator.component'; 4 | 5 | describe('ReduceOperatorComponent', () => { 6 | let component: ReduceOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ ReduceOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(ReduceOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/sample-operator/sample-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { SampleOperatorComponent } from './sample-operator.component'; 4 | 5 | describe('SampleOperatorComponent', () => { 6 | let component: SampleOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ SampleOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(SampleOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/share-operator/share-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { 3 | ConnectableObservable, 4 | interval, 5 | multicast, 6 | publish, 7 | refCount, 8 | share, 9 | Subject, 10 | } from 'rxjs'; 11 | 12 | @Component({ 13 | selector: 'app-share-operator', 14 | templateUrl: './share-operator.component.html', 15 | styleUrls: ['./share-operator.component.css'], 16 | }) 17 | export class ShareOperatorComponent implements OnInit { 18 | constructor() {} 19 | 20 | ngOnInit(): void { 21 | let source$ = interval(1000).pipe(share()); 22 | 23 | source$.subscribe((data) => { 24 | console.log(data); 25 | }); 26 | 27 | setTimeout(() => { 28 | source$.subscribe((data) => { 29 | console.log(data); 30 | }); 31 | }, 2000); 32 | } 33 | } 34 | -------------------------------------------------------------------------------- /src/app/pages/single-operator/single-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { SingleOperatorComponent } from './single-operator.component'; 4 | 5 | describe('SingleOperatorComponent', () => { 6 | let component: SingleOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ SingleOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(SingleOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/window-operator/window-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { WindowOperatorComponent } from './window-operator.component'; 4 | 5 | describe('WindowOperatorComponent', () => { 6 | let component: WindowOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ WindowOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(WindowOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/concat-operator/concat-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { concat, Observable, of } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-concat-operator', 6 | templateUrl: './concat-operator.component.html', 7 | styleUrls: ['./concat-operator.component.css'], 8 | }) 9 | export class ConcatOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source1$ = new Observable((observer) => { 14 | observer.next(1); 15 | observer.next(2); 16 | setTimeout(() => { 17 | observer.next(3); 18 | observer.error(); 19 | }, 1000); 20 | }); 21 | let source2$ = of('a', 'b', 'c', 'd'); 22 | 23 | concat(source1$, source2$).subscribe((data) => { 24 | console.log(data); 25 | }); 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /src/app/pages/merge-operator/merge-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { interval, merge, Observable, of } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-merge-operator', 6 | templateUrl: './merge-operator.component.html', 7 | styleUrls: ['./merge-operator.component.css'], 8 | }) 9 | export class MergeOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source1$ = interval(1000); 14 | let source2$ = of('a', 'b'); 15 | let source3$ = of(100, 200, 300); 16 | let source4$ = new Observable((observer) => { 17 | observer.next('leeela'); 18 | observer.error('error'); 19 | }); 20 | 21 | merge(source1$, source2$, source3$, source4$).subscribe((data) => { 22 | console.log(data); 23 | }); 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /src/app/pages/behavior-subject/behavior-subject.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { BehaviorSubjectComponent } from './behavior-subject.component'; 4 | 5 | describe('BehaviorSubjectComponent', () => { 6 | let component: BehaviorSubjectComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ BehaviorSubjectComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(BehaviorSubjectComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/combine-latest-all-operator/combine-latest-all-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { combineLatestAll, interval, map, of, take } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-combine-latest-all-operator', 6 | templateUrl: './combine-latest-all-operator.component.html', 7 | styleUrls: ['./combine-latest-all-operator.component.css'], 8 | }) 9 | export class CombineLatestAllOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source$ = of('a', 'b', 'c'); 14 | 15 | source$ 16 | .pipe( 17 | map((value) => { 18 | return interval(1000).pipe(take(4)); 19 | }), 20 | combineLatestAll() 21 | ) 22 | .subscribe((data) => { 23 | console.log(data); 24 | }); 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /src/app/pages/concat-component/concat-component.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { ConcatComponentComponent } from './concat-component.component'; 4 | 5 | describe('ConcatComponentComponent', () => { 6 | let component: ConcatComponentComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ ConcatComponentComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(ConcatComponentComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/test.ts: -------------------------------------------------------------------------------- 1 | // This file is required by karma.conf.js and loads recursively all the .spec and framework files 2 | 3 | import 'zone.js/testing'; 4 | import { getTestBed } from '@angular/core/testing'; 5 | import { 6 | BrowserDynamicTestingModule, 7 | platformBrowserDynamicTesting 8 | } from '@angular/platform-browser-dynamic/testing'; 9 | 10 | declare const require: { 11 | context(path: string, deep?: boolean, filter?: RegExp): { 12 | keys(): string[]; 13 | (id: string): T; 14 | }; 15 | }; 16 | 17 | // First, initialize the Angular testing environment. 18 | getTestBed().initTestEnvironment( 19 | BrowserDynamicTestingModule, 20 | platformBrowserDynamicTesting() 21 | ); 22 | // Then we find all the tests. 23 | const context = require.context('./', true, /\.spec\.ts$/); 24 | // And load the modules. 25 | context.keys().map(context); 26 | -------------------------------------------------------------------------------- /src/app/components/operators-basics/operators-basics.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { OperatorsBasicsComponent } from './operators-basics.component'; 4 | 5 | describe('OperatorsBasicsComponent', () => { 6 | let component: OperatorsBasicsComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ OperatorsBasicsComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(OperatorsBasicsComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/group-by-operator/group-by-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { GroupByOperatorComponent } from './group-by-operator.component'; 4 | 5 | describe('GroupByOperatorComponent', () => { 6 | let component: GroupByOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ GroupByOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(GroupByOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/is-empty-operator/is-empty-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { IsEmptyOperatorComponent } from './is-empty-operator.component'; 4 | 5 | describe('IsEmptyOperatorComponent', () => { 6 | let component: IsEmptyOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ IsEmptyOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(IsEmptyOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/to-array-operator/to-array-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { ToArrayOperatorComponent } from './to-array-operator.component'; 4 | 5 | describe('ToArrayOperatorComponent', () => { 6 | let component: ToArrayOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ ToArrayOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(ToArrayOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/debounce-operator/debounce-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { DebounceOperatorComponent } from './debounce-operator.component'; 4 | 5 | describe('DebounceOperatorComponent', () => { 6 | let component: DebounceOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ DebounceOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(DebounceOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/distinct-operator/distinct-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { DistinctOperatorComponent } from './distinct-operator.component'; 4 | 5 | describe('DistinctOperatorComponent', () => { 6 | let component: DistinctOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ DistinctOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(DistinctOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/fork-join-operator/fork-join-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { ForkJoinOperatorComponent } from './fork-join-operator.component'; 4 | 5 | describe('ForkJoinOperatorComponent', () => { 6 | let component: ForkJoinOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ ForkJoinOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(ForkJoinOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/generate-operator/generate-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { GenerateOperatorComponent } from './generate-operator.component'; 4 | 5 | describe('GenerateOperatorComponent', () => { 6 | let component: GenerateOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ GenerateOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(GenerateOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/merge-all-operator/merge-all-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { MergeAllOperatorComponent } from './merge-all-operator.component'; 4 | 5 | describe('MergeAllOperatorComponent', () => { 6 | let component: MergeAllOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ MergeAllOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(MergeAllOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/merge-map-operator/merge-map-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { MergeMapOperatorComponent } from './merge-map-operator.component'; 4 | 5 | describe('MergeMapOperatorComponent', () => { 6 | let component: MergeMapOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ MergeMapOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(MergeMapOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/pairwise-operator/pairwise-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { PairwiseOperatorComponent } from './pairwise-operator.component'; 4 | 5 | describe('PairwiseOperatorComponent', () => { 6 | let component: PairwiseOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ PairwiseOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(PairwiseOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/skip-last-operator/skip-last-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { SkipLastOperatorComponent } from './skip-last-operator.component'; 4 | 5 | describe('SkipLastOperatorComponent', () => { 6 | let component: SkipLastOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ SkipLastOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(SkipLastOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/take-last-operator/take-last-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { TakeLastOperatorComponent } from './take-last-operator.component'; 4 | 5 | describe('TakeLastOperatorComponent', () => { 6 | let component: TakeLastOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ TakeLastOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(TakeLastOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/take-while-operator/take-while-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { interval } from 'rxjs'; 3 | import { takeWhile } from 'rxjs/operators'; 4 | 5 | @Component({ 6 | selector: 'app-take-while-operator', 7 | templateUrl: './take-while-operator.component.html', 8 | styleUrls: ['./take-while-operator.component.css'], 9 | }) 10 | export class TakeWhileOperatorComponent implements OnInit { 11 | constructor() {} 12 | 13 | ngOnInit(): void { 14 | interval(500) 15 | .pipe(takeWhile((x, i) => x < 5, true)) 16 | .subscribe( 17 | (data) => { 18 | console.log(data); 19 | }, 20 | (error) => { 21 | console.log(error); 22 | }, 23 | () => { 24 | console.log('complete take while'); 25 | } 26 | ); 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /src/app/pages/throttle-operator/throttle-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { ThrottleOperatorComponent } from './throttle-operator.component'; 4 | 5 | describe('ThrottleOperatorComponent', () => { 6 | let component: ThrottleOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ ThrottleOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(ThrottleOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/retry-operator/retry-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { catchError, Observable, of, retry } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-retry-operator', 6 | templateUrl: './retry-operator.component.html', 7 | styleUrls: ['./retry-operator.component.css'], 8 | }) 9 | export class RetryOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source$ = new Observable((observer) => { 14 | observer.next(1); 15 | observer.next(2); 16 | observer.error('error'); 17 | }); 18 | 19 | source$ 20 | .pipe( 21 | retry(2), 22 | catchError((error) => { 23 | return of('a', 'b'); 24 | }) 25 | ) 26 | .subscribe((data) => { 27 | console.log(data); 28 | }); 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /src/app/pages/concat-all-operator/concat-all-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { ConcatAllOperatorComponent } from './concat-all-operator.component'; 4 | 5 | describe('ConcatAllOperatorComponent', () => { 6 | let component: ConcatAllOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ ConcatAllOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(ConcatAllOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/concat-map-operator/concat-map-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { ConcatMapOperatorComponent } from './concat-map-operator.component'; 4 | 5 | describe('ConcatMapOperatorComponent', () => { 6 | let component: ConcatMapOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ ConcatMapOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(ConcatMapOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/element-at-operator/element-at-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { ElementAtOperatorComponent } from './element-at-operator.component'; 4 | 5 | describe('ElementAtOperatorComponent', () => { 6 | let component: ElementAtOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ ElementAtOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(ElementAtOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/find-index-operator/find-index-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { FindIndexOperatorComponent } from './find-index-operator.component'; 4 | 5 | describe('FindIndexOperatorComponent', () => { 6 | let component: FindIndexOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ FindIndexOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(FindIndexOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/merge-map-component/merge-map-component.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { MergeMapComponentComponent } from './merge-map-component.component'; 4 | 5 | describe('MergeMapComponentComponent', () => { 6 | let component: MergeMapComponentComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ MergeMapComponentComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(MergeMapComponentComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/multicast-operator/multicast-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { MulticastOperatorComponent } from './multicast-operator.component'; 4 | 5 | describe('MulticastOperatorComponent', () => { 6 | let component: MulticastOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ MulticastOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(MulticastOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/observe-on-operator/observe-on-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { ObserveOnOperatorComponent } from './observe-on-operator.component'; 4 | 5 | describe('ObserveOnOperatorComponent', () => { 6 | let component: ObserveOnOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ ObserveOnOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(ObserveOnOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/partition-operator/partition-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { PartitionOperatorComponent } from './partition-operator.component'; 4 | 5 | describe('PartitionOperatorComponent', () => { 6 | let component: PartitionOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ PartitionOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(PartitionOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/retry-when-operator/retry-when-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { RetryWhenOperatorComponent } from './retry-when-operator.component'; 4 | 5 | describe('RetryWhenOperatorComponent', () => { 6 | let component: RetryWhenOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ RetryWhenOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(RetryWhenOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/skip-until-operator/skip-until-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { SkipUntilOperatorComponent } from './skip-until-operator.component'; 4 | 5 | describe('SkipUntilOperatorComponent', () => { 6 | let component: SkipUntilOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ SkipUntilOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(SkipUntilOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/skip-while-operator/skip-while-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { SkipWhileOperatorComponent } from './skip-while-operator.component'; 4 | 5 | describe('SkipWhileOperatorComponent', () => { 6 | let component: SkipWhileOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ SkipWhileOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(SkipWhileOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/start-with-operator/start-with-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { StartWithOperatorComponent } from './start-with-operator.component'; 4 | 5 | describe('StartWithOperatorComponent', () => { 6 | let component: StartWithOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ StartWithOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(StartWithOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/switch-all-operator/switch-all-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { SwitchAllOperatorComponent } from './switch-all-operator.component'; 4 | 5 | describe('SwitchAllOperatorComponent', () => { 6 | let component: SwitchAllOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ SwitchAllOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(SwitchAllOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/switch-map-operator/switch-map-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { SwitchMapOperatorComponent } from './switch-map-operator.component'; 4 | 5 | describe('SwitchMapOperatorComponent', () => { 6 | let component: SwitchMapOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ SwitchMapOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(SwitchMapOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/take-until-operator/take-until-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { TakeUntilOperatorComponent } from './take-until-operator.component'; 4 | 5 | describe('TakeUntilOperatorComponent', () => { 6 | let component: TakeUntilOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ TakeUntilOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(TakeUntilOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/take-while-operator/take-while-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { TakeWhileOperatorComponent } from './take-while-operator.component'; 4 | 5 | describe('TakeWhileOperatorComponent', () => { 6 | let component: TakeWhileOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ TakeWhileOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(TakeWhileOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/components/function-observable/function-observable.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { FunctionObservableComponent } from './function-observable.component'; 4 | 5 | describe('FunctionObservableComponent', () => { 6 | let component: FunctionObservableComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ FunctionObservableComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(FunctionObservableComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/buffer-time-operator/buffer-time-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { BufferTimeOperatorComponent } from './buffer-time-operator.component'; 4 | 5 | describe('BufferTimeOperatorComponent', () => { 6 | let component: BufferTimeOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ BufferTimeOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(BufferTimeOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/buffer-when-operator/buffer-when-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { BufferWhenOperatorComponent } from './buffer-when-operator.component'; 4 | 5 | describe('BufferWhenOperatorComponent', () => { 6 | let component: BufferWhenOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ BufferWhenOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(BufferWhenOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/catch-error-operator/catch-error-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { CatchErrorOperatorComponent } from './catch-error-operator.component'; 4 | 5 | describe('CatchErrorOperatorComponent', () => { 6 | let component: CatchErrorOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ CatchErrorOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(CatchErrorOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/exhaust-all-operator/exhaust-all-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { ExhaustAllOperatorComponent } from './exhaust-all-operator.component'; 4 | 5 | describe('ExhaustAllOperatorComponent', () => { 6 | let component: ExhaustAllOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ ExhaustAllOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(ExhaustAllOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/exhaust-map-operator/exhaust-map-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { ExhaustMapOperatorComponent } from './exhaust-map-operator.component'; 4 | 5 | describe('ExhaustMapOperatorComponent', () => { 6 | let component: ExhaustMapOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ ExhaustMapOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(ExhaustMapOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/window-time-operator/window-time-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { WindowTimeOperatorComponent } from './window-time-operator.component'; 4 | 5 | describe('WindowTimeOperatorComponent', () => { 6 | let component: WindowTimeOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ WindowTimeOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(WindowTimeOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/window-when-operator/window-when-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { WindowWhenOperatorComponent } from './window-when-operator.component'; 4 | 5 | describe('WindowWhenOperatorComponent', () => { 6 | let component: WindowWhenOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ WindowWhenOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(WindowWhenOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/buffer-when-operator/buffer-when-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { interval } from 'rxjs'; 3 | import { bufferWhen, tap } from 'rxjs/operators'; 4 | 5 | @Component({ 6 | selector: 'app-buffer-when-operator', 7 | templateUrl: './buffer-when-operator.component.html', 8 | styleUrls: ['./buffer-when-operator.component.css'], 9 | }) 10 | export class BufferWhenOperatorComponent implements OnInit { 11 | constructor() {} 12 | 13 | ngOnInit(): void { 14 | let x = 0; 15 | interval(500) 16 | .pipe( 17 | tap((i) => (x = i)), 18 | bufferWhen(() => { 19 | if (x > 5) { 20 | return interval(1000); 21 | } 22 | return interval(2000); 23 | }) 24 | ) 25 | .subscribe((data) => { 26 | console.log(data); 27 | }); 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /src/app/pages/materialize-operator/materialize-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { MaterializeOperatorComponent } from './materialize-operator.component'; 4 | 5 | describe('MaterializeOperatorComponent', () => { 6 | let component: MaterializeOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ MaterializeOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(MaterializeOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/merge-map-to-operator/merge-map-to-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { MergeMapToOperatorComponent } from './merge-map-to-operator.component'; 4 | 5 | describe('MergeMapToOperatorComponent', () => { 6 | let component: MergeMapToOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ MergeMapToOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(MergeMapToOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/async-subject/async-subject.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { AsyncSubject } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-async-subject', 6 | templateUrl: './async-subject.component.html', 7 | styleUrls: ['./async-subject.component.css'], 8 | }) 9 | export class AsyncSubjectComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let asyncSubject$ = new AsyncSubject(); 14 | 15 | asyncSubject$.subscribe((data) => { 16 | console.log('observer 1 ' + data); 17 | }); 18 | 19 | asyncSubject$.next(1); 20 | asyncSubject$.next(2); 21 | asyncSubject$.next(3); 22 | 23 | setTimeout(() => { 24 | asyncSubject$.subscribe((data) => { 25 | console.log('observer 2 ' + data); 26 | }); 27 | asyncSubject$.complete(); 28 | }, 3000); 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /src/app/pages/buffer-count-operator/buffer-count-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { BufferCountOperatorComponent } from './buffer-count-operator.component'; 4 | 5 | describe('BufferCountOperatorComponent', () => { 6 | let component: BufferCountOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ BufferCountOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(BufferCountOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/concat-map-to-operator/concat-map-to-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { ConcatMapToOperatorComponent } from './concat-map-to-operator.component'; 4 | 5 | describe('ConcatMapToOperatorComponent', () => { 6 | let component: ConcatMapToOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ ConcatMapToOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(ConcatMapToOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/ignore-elements-operator/ignore-elements-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { interval, of } from 'rxjs'; 3 | import { ignoreElements, take } from 'rxjs/operators'; 4 | 5 | @Component({ 6 | selector: 'app-ignore-elements-operator', 7 | templateUrl: './ignore-elements-operator.component.html', 8 | styleUrls: ['./ignore-elements-operator.component.css'], 9 | }) 10 | export class IgnoreElementsOperatorComponent implements OnInit { 11 | constructor() {} 12 | 13 | ngOnInit(): void { 14 | interval(1000) 15 | .pipe(take(5), ignoreElements()) 16 | .subscribe( 17 | (data) => { 18 | console.log(data); 19 | }, 20 | (error) => { 21 | console.log(error); 22 | }, 23 | () => { 24 | console.log('complete'); 25 | } 26 | ); 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /src/app/pages/publish-last-operator/publish-last-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { PublishLastOperatorComponent } from './publish-last-operator.component'; 4 | 5 | describe('PublishLastOperatorComponent', () => { 6 | let component: PublishLastOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ PublishLastOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(PublishLastOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/subscribe-on-operator/subscribe-on-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { SubscribeOnOperatorComponent } from './subscribe-on-operator.component'; 4 | 5 | describe('SubscribeOnOperatorComponent', () => { 6 | let component: SubscribeOnOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ SubscribeOnOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(SubscribeOnOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/switch-map-to-operator/switch-map-to-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { SwitchMapToOperatorComponent } from './switch-map-to-operator.component'; 4 | 5 | describe('SwitchMapToOperatorComponent', () => { 6 | let component: SwitchMapToOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ SwitchMapToOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(SwitchMapToOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/window-count-operator/window-count-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { WindowCountOperatorComponent } from './window-count-operator.component'; 4 | 5 | describe('WindowCountOperatorComponent', () => { 6 | let component: WindowCountOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ WindowCountOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(WindowCountOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/components/cancelling-observable/cancelling-observable.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { CancellingObservableComponent } from './cancelling-observable.component'; 4 | 5 | describe('CancellingObservableComponent', () => { 6 | let component: CancellingObservableComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ CancellingObservableComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(CancellingObservableComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/buffer-toggle-operator/buffer-toggle-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { BufferToggleOperatorComponent } from './buffer-toggle-operator.component'; 4 | 5 | describe('BufferToggleOperatorComponent', () => { 6 | let component: BufferToggleOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ BufferToggleOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(BufferToggleOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/window-toggle-operator/window-toggle-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { WindowToggleOperatorComponent } from './window-toggle-operator.component'; 4 | 5 | describe('WindowToggleOperatorComponent', () => { 6 | let component: WindowToggleOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ WindowToggleOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(WindowToggleOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/combine-latest-operator/combine-latest-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { CombineLatestOperatorComponent } from './combine-latest-operator.component'; 4 | 5 | describe('CombineLatestOperatorComponent', () => { 6 | let component: CombineLatestOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ CombineLatestOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(CombineLatestOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/dematerialize-operator/dematerialize-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { DematerializeOperatorComponent } from './dematerialize-operator.component'; 4 | 5 | describe('DematerializeOperatorComponent', () => { 6 | let component: DematerializeOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ DematerializeOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(DematerializeOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/publish-replay-operator/publish-replay-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { PublishReplayOperatorComponent } from './publish-replay-operator.component'; 4 | 5 | describe('PublishReplayOperatorComponent', () => { 6 | let component: PublishReplayOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ PublishReplayOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(PublishReplayOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/schedulers/schedulers.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { asapScheduler, asyncScheduler, merge, of, queueScheduler } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-schedulers', 6 | templateUrl: './schedulers.component.html', 7 | styleUrls: ['./schedulers.component.css'], 8 | }) 9 | export class SchedulersComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | console.log('script starting'); 14 | let queueScheduler$ = of('Queue Scheduler', queueScheduler); 15 | let asyncScheduler$ = of('Async Scheduler', asyncScheduler); 16 | let asapScheduler$ = of('Asap Scheduler', asapScheduler); 17 | 18 | merge(asyncScheduler$, queueScheduler$, asapScheduler$).subscribe( 19 | (data) => { 20 | console.log(data); 21 | } 22 | ); 23 | console.log('script Ending'); 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /src/app/pages/defer-operator/defer-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { defer, EMPTY, of } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-defer-operator', 6 | templateUrl: './defer-operator.component.html', 7 | styleUrls: ['./defer-operator.component.css'], 8 | }) 9 | export class DeferOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source$ = defer(() => { 14 | if (Math.random() > 0.5) { 15 | return EMPTY; 16 | } else { 17 | return of('a', 'b', 'c'); 18 | } 19 | }); 20 | 21 | source$.subscribe((data) => { 22 | console.log(data); 23 | }); 24 | 25 | source$.subscribe({ 26 | next: (data) => { 27 | console.log(data); 28 | }, 29 | error: (error) => { 30 | console.log(error); 31 | }, 32 | }); 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /src/app/pages/ignore-elements-operator/ignore-elements-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { IgnoreElementsOperatorComponent } from './ignore-elements-operator.component'; 4 | 5 | describe('IgnoreElementsOperatorComponent', () => { 6 | let component: IgnoreElementsOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ IgnoreElementsOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(IgnoreElementsOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/skip-last-operator/skip-last-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { interval, of } from 'rxjs'; 3 | import { skipLast, tap } from 'rxjs/operators'; 4 | 5 | @Component({ 6 | selector: 'app-skip-last-operator', 7 | templateUrl: './skip-last-operator.component.html', 8 | styleUrls: ['./skip-last-operator.component.css'], 9 | }) 10 | export class SkipLastOperatorComponent implements OnInit { 11 | constructor() {} 12 | 13 | ngOnInit(): void { 14 | // of(1, 2, 3, 4, 5) 15 | // .pipe(skipLast(2)) 16 | // .subscribe((data) => { 17 | // console.log(data); 18 | // }); 19 | 20 | interval(500) 21 | .pipe( 22 | tap((data) => { 23 | console.log(data); 24 | }), 25 | skipLast(10) 26 | ) 27 | .subscribe((data) => { 28 | console.log(data); 29 | }); 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */ 2 | { 3 | "compileOnSave": false, 4 | "compilerOptions": { 5 | "baseUrl": "./", 6 | "outDir": "./dist/out-tsc", 7 | "forceConsistentCasingInFileNames": true, 8 | "strict": true, 9 | "noImplicitReturns": true, 10 | "noFallthroughCasesInSwitch": true, 11 | "sourceMap": true, 12 | "declaration": false, 13 | "downlevelIteration": true, 14 | "experimentalDecorators": true, 15 | "moduleResolution": "node", 16 | "importHelpers": true, 17 | "target": "es2017", 18 | "module": "es2020", 19 | "lib": [ 20 | "es2018", 21 | "dom" 22 | ] 23 | }, 24 | "angularCompilerOptions": { 25 | "enableI18nLegacyMessageIdFormat": false, 26 | "strictInjectionParameters": true, 27 | "strictInputAccessModifiers": true, 28 | "strictTemplates": true 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /src/app/pages/default-if-empty-operator/default-if-empty-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { DefaultIfEmptyOperatorComponent } from './default-if-empty-operator.component'; 4 | 5 | describe('DefaultIfEmptyOperatorComponent', () => { 6 | let component: DefaultIfEmptyOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ DefaultIfEmptyOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(DefaultIfEmptyOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/min-operator/min-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { min, of } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-min-operator', 6 | templateUrl: './min-operator.component.html', 7 | styleUrls: ['./min-operator.component.css'], 8 | }) 9 | export class MinOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | // let source$ = of(1, 2, 3, 4, -30, 100, 2000, -1, -10); 14 | // source$.pipe(min()).subscribe((data) => { 15 | // console.log(data); 16 | // }); 17 | 18 | let persons = [ 19 | { name: 'Leela', age: 10 }, 20 | { name: 'Mathew', age: 30 }, 21 | { name: 'John', age: 20 }, 22 | ]; 23 | 24 | of(...persons) 25 | .pipe(min((a, b) => (a.age < b.age ? -1 : 1))) 26 | .subscribe((data) => { 27 | console.log(data); 28 | }); 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /src/app/pages/observe-on-operator/observe-on-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { asyncScheduler, map, observeOn, of, subscribeOn } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-observe-on-operator', 6 | templateUrl: './observe-on-operator.component.html', 7 | styleUrls: ['./observe-on-operator.component.css'], 8 | }) 9 | export class ObserveOnOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | console.log('start scripting'); 14 | let source$ = of(1, 2, 3, 45); 15 | 16 | source$ 17 | .pipe( 18 | map((data) => { 19 | console.log('map executing'); 20 | return data * 10; 21 | }), 22 | observeOn(asyncScheduler) 23 | ) 24 | .subscribe((data) => { 25 | console.log(data); 26 | }); 27 | console.log('end scripting'); 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /src/app/pages/with-latest-from-operator/with-latest-from-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { WithLatestFromOperatorComponent } from './with-latest-from-operator.component'; 4 | 5 | describe('WithLatestFromOperatorComponent', () => { 6 | let component: WithLatestFromOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ WithLatestFromOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(WithLatestFromOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/publish-behavior-operator/publish-behavior-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { PublishBehaviorOperatorComponent } from './publish-behavior-operator.component'; 4 | 5 | describe('PublishBehaviorOperatorComponent', () => { 6 | let component: PublishBehaviorOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ PublishBehaviorOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(PublishBehaviorOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/distinct-until-key-changed/distinct-until-key-changed.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { DistinctUntilKeyChangedComponent } from './distinct-until-key-changed.component'; 4 | 5 | describe('DistinctUntilKeyChangedComponent', () => { 6 | let component: DistinctUntilKeyChangedComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ DistinctUntilKeyChangedComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(DistinctUntilKeyChangedComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/combine-latest-all-operator/combine-latest-all-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { CombineLatestAllOperatorComponent } from './combine-latest-all-operator.component'; 4 | 5 | describe('CombineLatestAllOperatorComponent', () => { 6 | let component: CombineLatestAllOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ CombineLatestAllOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(CombineLatestAllOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/buffer-toggle-operator/buffer-toggle-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { interval } from 'rxjs'; 3 | import { bufferToggle, take, tap } from 'rxjs/operators'; 4 | 5 | @Component({ 6 | selector: 'app-buffer-toggle-operator', 7 | templateUrl: './buffer-toggle-operator.component.html', 8 | styleUrls: ['./buffer-toggle-operator.component.css'], 9 | }) 10 | export class BufferToggleOperatorComponent implements OnInit { 11 | constructor() {} 12 | 13 | ngOnInit(): void { 14 | let opening = interval(6000).pipe(tap(() => console.log('open'))); 15 | let closing = (data: number) => 16 | interval(3000).pipe(tap(() => console.log('close'))); 17 | interval(1000) 18 | .pipe( 19 | tap((data) => console.log(data)), 20 | bufferToggle(opening, closing), 21 | take(3) 22 | ) 23 | .subscribe((data) => console.log(data)); 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /src/app/pages/replay-subject/replay-subject.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { ReplaySubject } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-replay-subject', 6 | templateUrl: './replay-subject.component.html', 7 | styleUrls: ['./replay-subject.component.css'], 8 | }) 9 | export class ReplaySubjectComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let replaySubject$ = new ReplaySubject(2, 4000); 14 | replaySubject$.next(1); 15 | 16 | replaySubject$.subscribe((data) => { 17 | console.log('observer 1 ' + data); 18 | }); 19 | 20 | replaySubject$.next(2); 21 | replaySubject$.next(3); 22 | replaySubject$.next(4); 23 | 24 | setTimeout(() => { 25 | replaySubject$.subscribe((data) => { 26 | console.log('observer 2 ' + data); 27 | }); 28 | replaySubject$.next(5); 29 | }, 3000); 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /src/app/pages/distinct-operator/distinct-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { from, of } from 'rxjs'; 3 | import { distinct } from 'rxjs/operators'; 4 | 5 | @Component({ 6 | selector: 'app-distinct-operator', 7 | templateUrl: './distinct-operator.component.html', 8 | styleUrls: ['./distinct-operator.component.css'], 9 | }) 10 | export class DistinctOperatorComponent implements OnInit { 11 | constructor() {} 12 | 13 | ngOnInit(): void { 14 | of(1, 2, 3, 4, 5, 1, 2, 3, 4) 15 | .pipe(distinct()) 16 | .subscribe((data) => { 17 | console.log(data); 18 | }); 19 | 20 | var employees = [ 21 | { id: 1, name: 'Leela' }, 22 | { id: 2, name: 'Leela Web Dev' }, 23 | { id: 3, name: 'Leela' }, 24 | ]; 25 | 26 | from(employees) 27 | .pipe(distinct((x) => x.id)) 28 | .subscribe((data) => { 29 | console.log(data); 30 | }); 31 | } 32 | } 33 | -------------------------------------------------------------------------------- /src/app/pages/merge-map-operator/merge-map-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { of } from 'rxjs'; 3 | import { ajax } from 'rxjs/ajax'; 4 | import { map, mergeMap } from 'rxjs/operators'; 5 | 6 | @Component({ 7 | selector: 'app-merge-map-operator', 8 | templateUrl: './merge-map-operator.component.html', 9 | styleUrls: ['./merge-map-operator.component.css'], 10 | }) 11 | export class MergeMapOperatorComponent implements OnInit { 12 | constructor() {} 13 | 14 | ngOnInit(): void { 15 | of(1, 2, 3, 4, 5) 16 | .pipe( 17 | mergeMap((id: number) => { 18 | console.log(id); 19 | return ajax(`https://jsonplaceholder.typicode.com/posts/${id}`).pipe( 20 | map((data) => { 21 | return data.response; 22 | }) 23 | ); 24 | }) 25 | ) 26 | .subscribe((data) => { 27 | console.log(data); 28 | }); 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /src/app/pages/concat-map-operator/concat-map-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { of } from 'rxjs'; 3 | import { ajax } from 'rxjs/ajax'; 4 | import { concatMap, map } from 'rxjs/operators'; 5 | 6 | @Component({ 7 | selector: 'app-concat-map-operator', 8 | templateUrl: './concat-map-operator.component.html', 9 | styleUrls: ['./concat-map-operator.component.css'], 10 | }) 11 | export class ConcatMapOperatorComponent implements OnInit { 12 | constructor() {} 13 | 14 | ngOnInit(): void { 15 | of(1, 2, 3, 4) 16 | .pipe( 17 | concatMap((id: number) => { 18 | console.log(id); 19 | return ajax(`https://jsonplaceholder.typicode.com/posts/${id}`).pipe( 20 | map((data) => { 21 | return data.response; 22 | }) 23 | ); 24 | }) 25 | ) 26 | .subscribe((data) => { 27 | console.log(data); 28 | }); 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /src/app/pages/merge-all-operator/merge-all-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { interval, map, mergeAll, take } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-merge-all-operator', 6 | templateUrl: './merge-all-operator.component.html', 7 | styleUrls: ['./merge-all-operator.component.css'], 8 | }) 9 | export class MergeAllOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source$ = interval(1000).pipe(take(5)); 14 | 15 | source$ 16 | .pipe( 17 | map((value) => 18 | interval(1000).pipe( 19 | map( 20 | (val) => 21 | `Parent interval with value ${value} and child interval of ${val}` 22 | ), 23 | take(5) 24 | ) 25 | ), 26 | mergeAll(2) 27 | ) 28 | .subscribe((data) => { 29 | console.log(data); 30 | }); 31 | } 32 | } 33 | -------------------------------------------------------------------------------- /src/app/pages/switch-all-operator/switch-all-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { interval, map, switchAll, take } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-switch-all-operator', 6 | templateUrl: './switch-all-operator.component.html', 7 | styleUrls: ['./switch-all-operator.component.css'], 8 | }) 9 | export class SwitchAllOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source$ = interval(1000).pipe(take(5)); 14 | 15 | source$ 16 | .pipe( 17 | map((value) => 18 | interval(500).pipe( 19 | map( 20 | (val) => 21 | `parent interval value: ${value} with child interval ${val}` 22 | ), 23 | take(5) 24 | ) 25 | ), 26 | switchAll() 27 | ) 28 | .subscribe((data) => { 29 | console.log(data); 30 | }); 31 | } 32 | } 33 | -------------------------------------------------------------------------------- /src/app/pages/concat-map-to-operator/concat-map-to-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { of } from 'rxjs'; 3 | import { ajax, AjaxResponse } from 'rxjs/ajax'; 4 | import { concatMapTo, map } from 'rxjs/operators'; 5 | 6 | @Component({ 7 | selector: 'app-concat-map-to-operator', 8 | templateUrl: './concat-map-to-operator.component.html', 9 | styleUrls: ['./concat-map-to-operator.component.css'], 10 | }) 11 | export class ConcatMapToOperatorComponent implements OnInit { 12 | constructor() {} 13 | 14 | ngOnInit(): void { 15 | of(1, 2, 3, 4, 5) 16 | .pipe( 17 | concatMapTo( 18 | ajax(`https://jsonplaceholder.typicode.com/posts/1`).pipe( 19 | map((data: AjaxResponse) => { 20 | return data.response; 21 | }) 22 | ) 23 | ) 24 | ) 25 | .subscribe((data) => { 26 | console.log(data); 27 | }); 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /src/app/pages/distinct-until-changed-operator/distinct-until-changed-operator.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { DistinctUntilChangedOperatorComponent } from './distinct-until-changed-operator.component'; 4 | 5 | describe('DistinctUntilChangedOperatorComponent', () => { 6 | let component: DistinctUntilChangedOperatorComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async () => { 10 | await TestBed.configureTestingModule({ 11 | declarations: [ DistinctUntilChangedOperatorComponent ] 12 | }) 13 | .compileComponents(); 14 | }); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(DistinctUntilChangedOperatorComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/pages/partition-operator/partition-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { concatMap, concatMapTo, from, of, partition, toArray } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-partition-operator', 6 | templateUrl: './partition-operator.component.html', 7 | styleUrls: ['./partition-operator.component.css'], 8 | }) 9 | export class PartitionOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source$ = of(1, 2, 3, 4, 5, 6, 7, 8, 9); 14 | 15 | let data = partition(source$, (value) => value % 2 === 0); 16 | 17 | // data[0].subscribe((d) => { 18 | // console.log(d); 19 | // }); 20 | 21 | // data[1].subscribe((d) => { 22 | // console.log(d); 23 | // }); 24 | 25 | from(data) 26 | .pipe(concatMap((d) => d.pipe(toArray()))) 27 | .subscribe((value) => { 28 | console.log(value); 29 | }); 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /src/app/pages/materialize-operator/materialize-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { map, materialize, of } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-materialize-operator', 6 | templateUrl: './materialize-operator.component.html', 7 | styleUrls: ['./materialize-operator.component.css'], 8 | }) 9 | export class MaterializeOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source$ = of(1, 2, 3, 4, 5); 14 | 15 | source$ 16 | .pipe( 17 | map((data) => { 18 | throw 'caught error'; 19 | }), 20 | materialize() 21 | ) 22 | .subscribe({ 23 | next: (data) => { 24 | console.log(data); 25 | }, 26 | error: (error) => { 27 | console.log(error); 28 | }, 29 | complete: () => { 30 | console.log('complete'); 31 | }, 32 | }); 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /src/app/pages/merge-map-to-operator/merge-map-to-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { of } from 'rxjs'; 3 | import { ajax, AjaxResponse } from 'rxjs/ajax'; 4 | import { map, mergeMapTo } from 'rxjs/operators'; 5 | 6 | @Component({ 7 | selector: 'app-merge-map-to-operator', 8 | templateUrl: './merge-map-to-operator.component.html', 9 | styleUrls: ['./merge-map-to-operator.component.css'], 10 | }) 11 | export class MergeMapToOperatorComponent implements OnInit { 12 | constructor() {} 13 | 14 | ngOnInit(): void { 15 | of(1, 2, 3, 4, 5) 16 | .pipe( 17 | mergeMapTo( 18 | ajax(`https://jsonplaceholder.typicode.com/posts/2`).pipe( 19 | map((data: AjaxResponse) => { 20 | return data.response; 21 | }) 22 | ), 23 | 2 24 | ) 25 | ) 26 | .subscribe((data) => { 27 | console.log(data); 28 | }); 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /src/app/pages/skip-until-operator/skip-until-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { AfterViewInit, Component, OnInit } from '@angular/core'; 2 | import { fromEvent, interval, Observable } from 'rxjs'; 3 | import { skipUntil } from 'rxjs/operators'; 4 | 5 | @Component({ 6 | selector: 'app-skip-until-operator', 7 | templateUrl: './skip-until-operator.component.html', 8 | styleUrls: ['./skip-until-operator.component.css'], 9 | }) 10 | export class SkipUntilOperatorComponent implements OnInit, AfterViewInit { 11 | buttonEvent!: Observable; 12 | numbers: number[] = []; 13 | constructor() {} 14 | 15 | ngOnInit(): void {} 16 | 17 | ngAfterViewInit() { 18 | this.buttonEvent = fromEvent( 19 | document.getElementById('showuntilbutton')!, 20 | 'click' 21 | ); 22 | 23 | interval(500) 24 | .pipe(skipUntil(this.buttonEvent)) 25 | .subscribe((data) => { 26 | console.log(data); 27 | this.numbers.push(data); 28 | }); 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /src/app/pages/exhaust-map-operator/exhaust-map-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { interval, of } from 'rxjs'; 3 | import { ajax } from 'rxjs/ajax'; 4 | import { exhaustMap, filter, take, tap } from 'rxjs/operators'; 5 | 6 | @Component({ 7 | selector: 'app-exhaust-map-operator', 8 | templateUrl: './exhaust-map-operator.component.html', 9 | styleUrls: ['./exhaust-map-operator.component.css'], 10 | }) 11 | export class ExhaustMapOperatorComponent implements OnInit { 12 | constructor() {} 13 | 14 | ngOnInit(): void { 15 | interval(10) 16 | .pipe( 17 | filter((id) => id > 0), 18 | tap((id) => { 19 | console.log(id); 20 | }), 21 | exhaustMap((id: number) => { 22 | return ajax(`https://jsonplaceholder.typicode.com/posts/${id}`); 23 | }), 24 | take(5) 25 | ) 26 | .subscribe((data) => { 27 | console.log(data.response); 28 | }); 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /src/app/pages/max-operator/max-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { max, of } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-max-operator', 6 | templateUrl: './max-operator.component.html', 7 | styleUrls: ['./max-operator.component.css'], 8 | }) 9 | export class MaxOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | // let source$ = of(1, 2, 3, 100, -1, 34); 14 | 15 | // source$.pipe(max()).subscribe((data) => { 16 | // console.log(data); 17 | // }); 18 | 19 | let persons = [ 20 | { name: 'Leela', age: 20 }, 21 | { name: 'Mathew', age: 30 }, 22 | { name: 'John', age: 10 }, 23 | ]; 24 | 25 | of(...persons) 26 | .pipe( 27 | max((prevPerson, currPerson) => 28 | prevPerson.age > currPerson.age ? -1 : 1 29 | ) 30 | ) 31 | .subscribe((data) => { 32 | console.log(data); 33 | }); 34 | } 35 | } 36 | -------------------------------------------------------------------------------- /src/app/pages/void-subject/void-subject.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { Subject } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-void-subject', 6 | templateUrl: './void-subject.component.html', 7 | styleUrls: ['./void-subject.component.css'], 8 | }) 9 | export class VoidSubjectComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let subject$ = new Subject(); 14 | 15 | subject$.subscribe((data) => { 16 | console.log(data); 17 | }); 18 | 19 | subject$.next(1); 20 | subject$.next(2); 21 | 22 | let subject2$ = new Subject(); 23 | 24 | subject2$.subscribe((data) => { 25 | console.log(data); 26 | }); 27 | 28 | subject2$.next('Hai Leela'); 29 | subject2$.next(2); 30 | 31 | let subject3$ = new Subject(); 32 | 33 | subject3$.subscribe((data) => { 34 | console.log(data); 35 | }); 36 | 37 | subject3$.next(); 38 | } 39 | } 40 | -------------------------------------------------------------------------------- /src/app/pages/switch-map-operator/switch-map-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { interval, of } from 'rxjs'; 3 | import { ajax } from 'rxjs/ajax'; 4 | import { filter, map, switchMap, take } from 'rxjs/operators'; 5 | 6 | @Component({ 7 | selector: 'app-switch-map-operator', 8 | templateUrl: './switch-map-operator.component.html', 9 | styleUrls: ['./switch-map-operator.component.css'], 10 | }) 11 | export class SwitchMapOperatorComponent implements OnInit { 12 | constructor() {} 13 | 14 | ngOnInit(): void { 15 | interval(30) 16 | .pipe( 17 | filter((id) => id > 0), 18 | switchMap((id) => { 19 | return ajax(`https://jsonplaceholder.typicode.com/posts/${id}`).pipe( 20 | map((data) => { 21 | return data.response; 22 | }) 23 | ); 24 | }), 25 | take(5) 26 | ) 27 | .subscribe((data) => { 28 | console.log(data); 29 | }); 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /src/app/pages/buffer-operator/buffer-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { AfterViewInit, Component, OnInit } from '@angular/core'; 2 | import { fromEvent, interval, Observable } from 'rxjs'; 3 | import { buffer, tap } from 'rxjs/operators'; 4 | 5 | @Component({ 6 | selector: 'app-buffer-operator', 7 | templateUrl: './buffer-operator.component.html', 8 | styleUrls: ['./buffer-operator.component.css'], 9 | }) 10 | export class BufferOperatorComponent implements OnInit, AfterViewInit { 11 | intervalData: number[] = []; 12 | showData$!: Observable; 13 | constructor() {} 14 | 15 | ngOnInit(): void {} 16 | 17 | ngAfterViewInit() { 18 | this.showData$ = fromEvent(document.getElementById('showButton')!, 'click'); 19 | } 20 | 21 | startInterval() { 22 | interval(1000) 23 | .pipe( 24 | tap((data) => console.log(data)), 25 | buffer(this.showData$) 26 | ) 27 | .subscribe((data: number[]) => { 28 | this.intervalData.push(...data); 29 | }); 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /src/app/pages/generate-operator/generate-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { asapScheduler, asyncScheduler, generate } from 'rxjs'; 3 | import { GenerateOptions } from 'rxjs/internal/observable/generate'; 4 | 5 | @Component({ 6 | selector: 'app-generate-operator', 7 | templateUrl: './generate-operator.component.html', 8 | styleUrls: ['./generate-operator.component.css'], 9 | }) 10 | export class GenerateOperatorComponent implements OnInit { 11 | constructor() {} 12 | 13 | ngOnInit(): void { 14 | console.log('start scripting'); 15 | let generateComponent: GenerateOptions = { 16 | initialState: 0, 17 | condition: (x) => x < 3, 18 | iterate: (x) => x + 1, 19 | resultSelector: (x) => x, 20 | scheduler: asyncScheduler, 21 | }; 22 | 23 | let source$ = generate(generateComponent); 24 | 25 | source$.subscribe((data) => { 26 | console.log(data); 27 | }); 28 | console.log('end scripting'); 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /src/app/components/operators-basics/operators-basics.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { interval, of } from 'rxjs'; 3 | import { filter, map } from 'rxjs/operators'; 4 | 5 | @Component({ 6 | selector: 'app-operators-basics', 7 | templateUrl: './operators-basics.component.html', 8 | styleUrls: ['./operators-basics.component.css'], 9 | }) 10 | export class OperatorsBasicsComponent implements OnInit { 11 | constructor() {} 12 | 13 | ngOnInit(): void { 14 | const newObservable = interval(1000); 15 | 16 | newObservable.subscribe((number) => { 17 | if (number % 2 === 0) { 18 | console.log('Even Number: ' + number); 19 | } 20 | }); 21 | 22 | newObservable 23 | .pipe( 24 | filter((number) => { 25 | return number % 2 === 0; 26 | }), 27 | map((number) => { 28 | return 'even number:' + number; 29 | }) 30 | ) 31 | .subscribe((number) => { 32 | console.log(number); 33 | }); 34 | } 35 | } 36 | -------------------------------------------------------------------------------- /src/app/pages/exhaust-all-operator/exhaust-all-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { concatAll, exhaustAll, filter, interval, map, take } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-exhaust-all-operator', 6 | templateUrl: './exhaust-all-operator.component.html', 7 | styleUrls: ['./exhaust-all-operator.component.css'], 8 | }) 9 | export class ExhaustAllOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source$ = interval(1000).pipe( 14 | filter((value) => value > 0), 15 | take(4) 16 | ); 17 | 18 | source$ 19 | .pipe( 20 | map((value) => 21 | interval(500).pipe( 22 | map( 23 | (val) => 24 | `parent interval value ${value} with child interval ${val}` 25 | ), 26 | take(3) 27 | ) 28 | ), 29 | exhaustAll() 30 | ) 31 | .subscribe((data) => { 32 | console.log(data); 33 | }); 34 | } 35 | } 36 | -------------------------------------------------------------------------------- /src/app/pages/debounce-operator/debounce-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { AfterViewInit, Component, OnInit } from '@angular/core'; 2 | import { fromEvent, interval } from 'rxjs'; 3 | import { debounce } from 'rxjs/operators'; 4 | 5 | @Component({ 6 | selector: 'app-debounce-operator', 7 | templateUrl: './debounce-operator.component.html', 8 | styleUrls: ['./debounce-operator.component.css'], 9 | }) 10 | export class DebounceOperatorComponent implements OnInit, AfterViewInit { 11 | constructor() {} 12 | 13 | ngOnInit(): void { 14 | // interval(1000) 15 | // .pipe(debounce((value) => interval(value * 100))) 16 | // .subscribe((data) => { 17 | // console.log(data); 18 | // }); 19 | //output: 0->1->2-.3 -....9.... () 20 | } 21 | 22 | ngAfterViewInit() { 23 | let buttonEvent = fromEvent( 24 | document.getElementById('button_debounce')!, 25 | 'click' 26 | ); 27 | 28 | buttonEvent.pipe(debounce((value) => interval(1000))).subscribe((data) => { 29 | console.log(data); 30 | }); 31 | } 32 | } 33 | -------------------------------------------------------------------------------- /src/app/pages/merge-map-component/merge-map-component.component.ts: -------------------------------------------------------------------------------- 1 | import { HttpClient } from '@angular/common/http'; 2 | import { Component, OnInit } from '@angular/core'; 3 | import { 4 | concatMap, 5 | exhaustMap, 6 | filter, 7 | interval, 8 | mergeMap, 9 | of, 10 | switchMap, 11 | take, 12 | } from 'rxjs'; 13 | 14 | @Component({ 15 | selector: 'app-merge-map-component', 16 | templateUrl: './merge-map-component.component.html', 17 | styleUrls: ['./merge-map-component.component.css'], 18 | }) 19 | export class MergeMapComponentComponent implements OnInit { 20 | constructor(private http: HttpClient) {} 21 | 22 | ngOnInit(): void { 23 | let postIds = interval(1).pipe( 24 | filter((val) => val > 0), 25 | take(5) 26 | ); 27 | postIds 28 | .pipe( 29 | exhaustMap((id) => { 30 | return this.http.get( 31 | `https://jsonplaceholder.typicode.com/posts/${id}` 32 | ); 33 | }) 34 | ) 35 | .subscribe((postDetails) => { 36 | console.log(postDetails); 37 | }); 38 | } 39 | } 40 | -------------------------------------------------------------------------------- /src/app/pages/dematerialize-operator/dematerialize-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { dematerialize, ObservableNotification, of } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-dematerialize-operator', 6 | templateUrl: './dematerialize-operator.component.html', 7 | styleUrls: ['./dematerialize-operator.component.css'], 8 | }) 9 | export class DematerializeOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let obsNotifications: ObservableNotification[] = []; 14 | for (let i = 0; i < 10; i++) { 15 | obsNotifications.push({ 16 | kind: 'N', 17 | value: i, 18 | }); 19 | } 20 | 21 | of(...obsNotifications) 22 | .pipe(dematerialize()) 23 | .subscribe({ 24 | next: (data) => { 25 | console.log(data); 26 | }, 27 | error: (error) => { 28 | console.log(error); 29 | }, 30 | complete: () => { 31 | console.log('complete'); 32 | }, 33 | }); 34 | } 35 | } 36 | -------------------------------------------------------------------------------- /src/app/pages/catch-error-operator/catch-error-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { catchError, Observable, of, take } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-catch-error-operator', 6 | templateUrl: './catch-error-operator.component.html', 7 | styleUrls: ['./catch-error-operator.component.css'], 8 | }) 9 | export class CatchErrorOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source$ = new Observable((observer) => { 14 | observer.next('a'); 15 | observer.next('b'); 16 | observer.error('error occured'); 17 | }); 18 | 19 | source$ 20 | .pipe( 21 | catchError((error, caught) => { 22 | return caught; 23 | }), 24 | take(5) 25 | ) 26 | .subscribe({ 27 | next: (data) => { 28 | console.log(data); 29 | }, 30 | error: (error) => { 31 | console.log(error); 32 | }, 33 | complete: () => { 34 | console.log('complete'); 35 | }, 36 | }); 37 | } 38 | } 39 | -------------------------------------------------------------------------------- /src/app/pages/combine-latest-operator/combine-latest-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { combineLatest, Observable } from 'rxjs'; 3 | 4 | @Component({ 5 | selector: 'app-combine-latest-operator', 6 | templateUrl: './combine-latest-operator.component.html', 7 | styleUrls: ['./combine-latest-operator.component.css'], 8 | }) 9 | export class CombineLatestOperatorComponent implements OnInit { 10 | constructor() {} 11 | 12 | ngOnInit(): void { 13 | let source1$ = new Observable((observer) => { 14 | let number = 0; 15 | for (let i = 1000; i < 10000; i += 1000) { 16 | setTimeout(() => { 17 | if (number === 6) { 18 | observer.error('error'); 19 | } 20 | observer.next(number++); 21 | }, i); 22 | } 23 | }); 24 | 25 | let source2$ = new Observable((observer) => { 26 | setTimeout(() => { 27 | observer.next(10); 28 | }, 5000); 29 | }); 30 | 31 | combineLatest([source1$, source2$]).subscribe((data) => { 32 | console.log(data); 33 | }); 34 | } 35 | } 36 | -------------------------------------------------------------------------------- /src/app/pages/take-until-operator/take-until-operator.component.ts: -------------------------------------------------------------------------------- 1 | import { AfterViewInit, Component, OnInit } from '@angular/core'; 2 | import { fromEvent, interval, Observable } from 'rxjs'; 3 | import { takeUntil } from 'rxjs/operators'; 4 | 5 | @Component({ 6 | selector: 'app-take-until-operator', 7 | templateUrl: './take-until-operator.component.html', 8 | styleUrls: ['./take-until-operator.component.css'], 9 | }) 10 | export class TakeUntilOperatorComponent implements OnInit, AfterViewInit { 11 | buttonEvent!: Observable; 12 | constructor() {} 13 | 14 | ngOnInit(): void {} 15 | 16 | ngAfterViewInit() { 17 | this.buttonEvent = fromEvent( 18 | document.getElementById('takeUntil')!, 19 | 'click' 20 | ); 21 | } 22 | 23 | startTimer() { 24 | interval(500) 25 | .pipe(takeUntil(this.buttonEvent)) 26 | .subscribe( 27 | (data) => { 28 | console.log(data); 29 | }, 30 | (error) => { 31 | console.log(error); 32 | }, 33 | () => { 34 | console.log('complete'); 35 | } 36 | ); 37 | } 38 | } 39 | --------------------------------------------------------------------------------