angular

Angular 4 Pipe Filter

by

Here is a working plunkr with a filter and sortBy pipe. https://plnkr.co/edit/vRvnNUULmBpkbLUYk4uw?p=preview As developer033 mentioned in a comment, you are passing in a single value to the filter pipe, when the filter pipe is expecting an array of values. I would tell the pipe to expect a single value instead of an array export class … Read more

How we can use pipes in React JavaScript?

by

There are simply no pipes, because anything evaluated in the brackets is considered plain JavaScript. Because this is evaluated as plain javascript, there is simply no need for pipes. If this.state.variable is a string, I can use the .toUpperCase() prototype to display the string in all uppercase: {this.state.variable.toUpperCase()} This would be functionally equivalent to UpperCasePipe: … Read more

Handle form errors using components Angular – TypeScript

by

You can move the validation errors into a component and pass in the formControl.errors as an input property. That way all the validation messages can be re-used. Here is an example on StackBlitz. The code is using Angular Material but still should be handy even if you aren’t. validation-errors.component.ts import { Component, OnInit, Input, ChangeDetectionStrategy … Read more

Angular2 detect change in service

by

Edit: Following the Mark’s comment, a Subject / Observable should be preferred: EventEmitter should only be used for emitting custom Events in components, and that we should use Rx for other observable/event scenarios. Original Answer: You should use an EventEmitter in the service: export class LangService { langUpdated:EventEmitter = new EventEmitter(); setLang(lang) { this.lang = … Read more

Angular http.post without .subscribe callback

by

I do not think you can. http.post (and get, put, delete, etc) returns a cold Observable, i.e. an Observable for which: its underlying producer is created and activated during subscription Source. This means the function represented by the Observable is activated only with the subscribe() method. Convenience methods subscribe too, see implementation details for Observable#toPromise() … Read more

Angular2 router – Navigate to the current page with different parameters

by

The page will not refresh, cause that’s how the Router works.. without refreshing the page! You have to subscribe to the route parameters to detect changes in them and then do whatever you want to with that information.. So inject ActivatedRoute into your component and subscribe to the parameters like this: constructor(private route: ActivatedRoute) {} … Read more

Angular 2 observable subscribing twice executes call twice

by

You may use the share operator on your result from HttpClient.get, like this: var observable = this.httpClient.get(‘api/version/secured’, { headers: httpHeaders }) .pipe(share()); You’ll need to add the following import on top of your script: import { share } from ‘rxjs/operators’; The share operator makes an observable hot, i.e. shared between subscribers. But there’s a lot … Read more

How to install npm packages on StackBlitz? [closed]

by

Under the “Files” tree is a “Dependencies” section. You can add your dependencies there. If you just want the latest version you can just use the package name (ex: ngx-bootstrap) or you can target a specific version (ex: [email protected]). Update 9/5/2022 NextJS It looks like dependencies are not auto installed for NextJS projects. You do … Read more