Questions tagged [async-pipe]
99 questions
14
votes
5 answers
async pipe sends 'null' value to the child component
I want to pass a value to the child component. this value is an Observable, so I use async pipe.
test$ is just a normal observable variable, that emits values after a period of time (3000 ms), simulating an…

Sh eldeeb
- 1,589
- 3
- 18
- 41
5
votes
2 answers
ngIf Async Pipe as value with only null check
I have an observable that I would like to create a variable with in the ngIf as well as only return false if the value is null (the observable returns a number)
I need to explicitly check for null as my observable can return 0 as a value which…

iamsimonsmale
- 366
- 3
- 14
5
votes
3 answers
How to use material table with async pipe and change detection? (Not working properly)
I've spent about 3 whole days trying to figure this out.
Behavior expected: Material Table always renders with most current data from backend. When a new item is added to table from a separate component, a router redirect to the page shows updated…

cyberguy
- 233
- 3
- 10
5
votes
3 answers
Angular: create dynamic Reactive Form after async call & AsyncPipe
I do an async service call to get a list of elements.
public elementList: Array;
...
this.service.getElementList().subscribe( list => {
this.elementList = list;
this.createFormGroup(list);
}
);
...
When I…

pepgrifell
- 103
- 2
- 9
4
votes
2 answers
Async pipe not updating the view
Repro
https://stackblitz.com/edit/angular-rlqkyb
app.service
Simple service creating a BehaviorSubject with some default values, a function to return this subject as an observable and finally a function to emit a new value on the…

ssougnez
- 5,315
- 11
- 46
- 79
4
votes
1 answer
element is not rendering properly with *ngIf async pipe in unit test spec
What I'm trying to do is get the reference of a button in order to simulate a click event, my main problem is that the button is not rendering cause the component is not detecting the change of a list that should be populated by that time.
Here is…

sebastian donastor
- 41
- 3
3
votes
2 answers
Does async pipe automatically unsubscribe from observable, if I change the observable?
I'm trying to make a language pipe with ngrx.
component.html:
{
return…
{{1 | language: languageId | async }}
language pipe: constructor(private store:Store){} transform(resourceId: number, languageId:number): Observable
csiki100
- 33
- 4
3
votes
2 answers
How to set empty and default value of a select element when using async pipes in Angular
I'm trying to use async pipe in my Angular application, and this in my Typescript file:
this.mySupplierList$ = this._mySupplierService.getSupplierList();
and the HTML file:
3
votes
2 answers
Why doesn't async pipe detect changes in Angular (but subscription in component.ts does)?
I'm using an async pipe in angular to monitor an observable coming from an rxjs store. The component's ngOnInit looks like this
ngOnInit() {
this.userRole$ = this.store.select(selectUserProfile).pipe(
filter(user => !!user),
map(user =>…

Jack O'Neill
- 452
- 4
- 11
2
votes
1 answer
Proper Way for Handling Observables for Async Pipe Rendering
I am trying to retrieve information from an Observable Object.
but I can't figure out how to do it properly.
such as this for example, Dog API
it should return a JSON object
{
"message":…

Mamdouh Morad
- 35
- 4
2
votes
1 answer
Best practices for avoiding memory leaks in angular
I'm trying detect and fix potential memory leaks in my angular/spartacus application.
So basically I'm looking for any "subscribe(..." calls in my code base and evaluate what I can do.
I know that simplest form is simply to use observables directly…

Sergej Bjakow
- 21
- 1
2
votes
0 answers
Angular | RxJS "of" operator doesn't trigger change detection
I have app with rxjs v7.5, ngrx v14.0 and use localStorage to cache http responses.When I get data straight from http everything is working fine, but when I returning data from storage by rxjs operator: of(value) and that doesn't trigger UI change…

Przemohawryl
- 21
- 1
2
votes
1 answer
How to cause observables to re-emit when ngModel value changes
I'm using these observables in my HTML but they are not re-emitting each time the input values of my HTML controls change (and they depend on those values so they become out of sync). For instance when this updates…

BeniaminoBaggins
- 11,202
- 41
- 152
- 287
2
votes
2 answers
Async pipe and subscribe on the same Observable
I'm using async pipe in my template to get a list of users that match a certain condition (getNonRedirectingList). Users are stored in a Firestore instance.
In my component template I have the following (simplified) code:

Lucio Crusca
- 1,277
- 3
- 15
- 41
2
votes
4 answers
Error: The pipe 'async' could not be found! after AOT & IVY update
The project that I am working on just recently for upgraded to AOT compliance and since that happened, I am having issues with | async pipe when used in HTML. For example my HTML code looks like following:

Lost
- 12,007
- 32
- 121
- 193