refactor: improve code readability of challenge 38

This commit is contained in:
kabrunko-dev
2024-01-02 18:25:50 -03:00
parent a2923784d7
commit 96f5e7d74a

View File

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