fix(docs-infra): convert hard-coded comparing-observables examples into a proper mini-app (#34327)

Previously, the examples in the `comparing-observables` guide were hard-coded.
This made it impossible to test them and verify they are correct.

This commit fixes this by converting them into a proper mini-app. In a
subsequent commit, tests will be added to verify that the source code
works as expected (and guard against regressions).

Fixes #31024

PR Close #34327

aio/content/examples/comparing-observables/src/observables.ts

@@ -0,0 +1,40 @@
+import { map } from 'rxjs/operators';
+import { Observable } from 'rxjs';
+
+// #docregion observable
+
+// declare a publishing operation
+const observable = new Observable<number>(observer => {
+  // Subscriber fn...
+});
+
+// initiate execution
+observable.subscribe(() => {
+  // observer handles notifications
+});
+
+// #enddocregion observable
+
+// #docregion unsubscribe
+
+const subscription = observable.subscribe(() => {
+  // observer handles notifications
+});
+
+subscription.unsubscribe();
+
+// #enddocregion unsubscribe
+
+// #docregion error
+
+observable.subscribe(() => {
+  throw Error('my error');
+});
+
+// #enddocregion error
+
+// #docregion chain
+
+observable.pipe(map(v => 2 * v));
+
+// #enddocregion chain

aio/content/examples/comparing-observables/src/promises.ts

@@ -0,0 +1,25 @@
+// #docregion promise
+// initiate execution
+const promise = new Promise<number>((resolve, reject) => {
+  // Executer fn...
+});
+
+promise.then(value => {
+  // handle result here
+});
+
+// #enddocregion promise
+
+// #docregion chain
+
+promise.then(v => 2 * v);
+
+// #enddocregion chain
+
+// #docregion error
+
+promise.then(() => {
+  throw Error('my error');
+});
+
+// #enddocregion error