vcgit-forge/angular-challenges
1
0
Fork 0
mirror of https://github.com/Raghu-Ch/angular-challenges.git synced 2026-02-13 14:23:02 -05:00
Code Issues Packages Projects Releases Wiki Activity

style: cap response div

Browse Source
This commit is contained in:
Devesh
2023-10-14 10:36:52 +05:30
parent ccb3b106dc
commit 7e4c750613
2 changed files with 13 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
apps/rxjs-catch-error/src/app/app.component.ts
View File

@@ -1,6 +1,6 @@
import { Component, ElementRef, ViewChild } from '@angular/core'; import { Component, ElementRef, ViewChild } from '@angular/core';
import { HttpClient } from '@angular/common/http'; import { HttpClient } from '@angular/common/http';
import { concatMap, fromEvent, map } from 'rxjs'; import { Observable, Subscription, concatMap, fromEvent, map } from 'rxjs';
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
@Component({ @Component({
@@ -9,13 +9,15 @@ import { CommonModule } from '@angular/common';
selector: 'app-root', selector: 'app-root',
template: ` template: `
<div class="form-container"> <div class="form-container">
<span>Posible values: posts, comments, albums, photos, todos, users</span> <span
>possible values: posts, comments, albums, photos, todos, users</span
>
</div> </div>
<div class="form-container"> <div class="form-container">
<input #inputRef type="text" placeholder="Enter text" /> <input #inputRef type="text" placeholder="Enter text" />
<button #buttonRef>Fetch</button> <button #buttonRef>Fetch</button>
</div> </div>
<div class="form-container"> <div class="response">
{{ response | json }} {{ response | json }}
</div> </div>
`, `,
@@ -46,6 +48,13 @@ import { CommonModule } from '@angular/common';
border-radius: 4px; border-radius: 4px;
cursor: pointer; cursor: pointer;
} }
.response {
margin-left: 25%;
margin-top: 2%;
width: 50%;
text-align: center;
border: 1px solid #ccc;
}
`, `,
], ],
}) })

2
docs/src/content/docs/challenges/rxjs/38-rxjs-catch-error.md
View File

@@ -19,7 +19,7 @@ Handle the error without completion of the subscription.
## Constraints ## Constraints
## Users should be able to console log value/error each time clicks on the fetch button. Users should be able to console log value/error each time clicks on the fetch button.
:::note :::note
Start the project by running: `npx nx serve rxjs-catch-error`. Start the project by running: `npx nx serve rxjs-catch-error`.