refactor: improve code readability of challenge 38

apps/rxjs/catch-error/src/app/app.component.ts

@@ -1,8 +1,8 @@
-import { Component, DestroyRef, inject } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { HttpClient } from '@angular/common/http';
-import { FormsModule } from '@angular/forms';
+import { Component, DestroyRef, OnInit, inject } from '@angular/core';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { FormsModule } from '@angular/forms';
 import { Subject, concatMap, map } from 'rxjs';
 
 @Component({
@@ -11,11 +11,11 @@ import { Subject, concatMap, map } from 'rxjs';
   selector: 'app-root',
   template: `
     <div class="form-container">
-      <span
-        >possible values: posts, comments, albums, photos, todos, users</span
-      >
+      <span>
+        possible values: posts, comments, albums, photos, todos, users
+      </span>
     </div>
-    <form class="form-container" (ngSubmit)="submit$$.next()">
+    <form class="form-container" (ngSubmit)="submit$.next()">
       <input
         type="text"
         placeholder="Enter text"
@@ -29,20 +29,22 @@ import { Subject, concatMap, map } from 'rxjs';
   `,
   styleUrls: ['./app.component.css'],
 })
-export class AppComponent {
-  submit$$ = new Subject<void>();
+export class AppComponent implements OnInit {
+  submit$ = new Subject<void>();
   input = '';
   response: unknown;
+
   private destroyRef = inject(DestroyRef);
-  constructor(private http: HttpClient) {}
+  private http = inject(HttpClient);
+
   ngOnInit() {
-    this.submit$$
+    this.submit$
       .pipe(
         map(() => this.input),
         concatMap((value) =>
-          this.http.get(`https://jsonplaceholder.typicode.com/${value}/1`)
+          this.http.get(`https://jsonplaceholder.typicode.com/${value}/1`),
         ),
-        takeUntilDestroyed(this.destroyRef)
+        takeUntilDestroyed(this.destroyRef),
       )
       .subscribe({
         next: (value) => {