Questions tagged [angular2-changedetection]
473 questions
25
votes
4 answers
How to perform change detection on div resizing
I use Bootstrap for my layout and I need to check if the automatic calculated size of my div with bootstrap for example width = 25% is changed.
How to perform change detection on a attribute which I don't set in my template, but is set by…

Michael Burger
- 643
- 1
- 9
- 17
22
votes
2 answers
Should I always use ChangeDetectionStrategy.OnPush
Should I always use ChangeDetectionStrategy.OnPush in my components?
I always hear how OnPush is absolutely amazing, and solves so many issues, speeds up the Angular app, and even get rid of NgZone. But if it is, why isn't it generated by default…

Dolan
- 1,519
- 4
- 16
- 36
20
votes
6 answers
Refresh Header after Login in Angular2
So I have a header component that displays either the User's name or "Sign In" depending on whether they are logged in or not. I also have a Login component that does all of the business logic of logging in. They currently do not have a parent /…

Pinski
- 2,607
- 2
- 24
- 25
18
votes
3 answers
Updating boolean in AfterViewInit causes "Expression has changed after it was checked"
I have a simple alert component which I'm creating dynamically in the view. Since it's created dynamically I've set an option to automatically display the alert after it has been initialised.
Although it's working I'd like to understand why I have…

Daniel Grima
- 2,765
- 7
- 34
- 58
18
votes
4 answers
Updating value in parent component from child one causes ExpressionChangedAfterItHasBeenCheckedError in Angular
I have two component: ParentComponent > ChildComponent and a service, e.g. TitleService.
ParentComponent looks like this:
export class ParentComponent implements OnInit, OnDestroy {
title: string;
private titleSubscription: Subscription;
…

Slava Fomin II
- 26,865
- 29
- 124
- 202
18
votes
3 answers
"async" pipe not rendering the stream updates
Trying to render the window size on window resize through a stream in an angular 2 component utilizing an async pipe:
Size: {{size$ | async | json}}
const windowSize$ = new BehaviorSubject(getWindowSize()); Observable.fromEvent(window,…
Daniel Birowsky Popeski
- 8,752
- 12
- 60
- 125
18
votes
1 answer
Angular 2 How to get Angular to detect changes made outside Angular?
I am trying to create a simple example project to test the angular 2 change detection mechanism: I create a pure javascript object in script tags on the main index page. it contains the following:
var Tryout = {};
Tryout.text =…

Denko Mancheski
- 2,709
- 2
- 18
- 26
17
votes
3 answers
How to trigger change detection in Angular2?
I'm creating a Facebook service that calls the Facebook javascript api and am wondering how to best implement change detection when my values are updated.
I have a UserService which has a currentUser property that is a…

Jason Goemaat
- 28,692
- 15
- 86
- 113
16
votes
2 answers
How to fix ChangeDetectorRef import error: No provider for ChangeDetectorRef
I'm having an issue importing ChangeDetectorRef into one of my components.
For reference, the family tree goes PComponent (parent) -> Options-Grid (child) -> FComponent (grandchild).
This is the error I'm getting in the…

thenolin
- 1,013
- 3
- 10
- 28
16
votes
2 answers
Why calling detectChanges() inside component doesn't update values, but wrapping code in setTimeout() does it?
I'm trying to automatically select the first value from set of options in
export class ExampleComponent implements OnInit, AfterViewInit {
@ViewChildren('auto') matAutocomplete: QueryList;
constructor(private cdr:…

Kristian Vitozev
- 5,791
- 6
- 36
- 56
16
votes
2 answers
how to disable angular2 change detection for 3rd party libraries
I have google maps which triggers 100+ times per second change detection. how to disable change detection for this.
Click here for map preview
it will be even worse when using mouseover event.
ngDoCheck() {
console.log('do check', this.i++);
}

tarmo
- 325
- 1
- 2
- 7
15
votes
1 answer
How can you identify what's triggering round of change detection detection in Angular2 (debugging ngDoCheck infinite loop)?
I haven't been able to make a minimal reproduction I can put in a plunkr, but in my app I have an infinite loop where ngDoCheck in the root component is called infinitely, so I'd like to be able to identify what is actually changing.
I've looked…

tobek
- 4,349
- 3
- 32
- 41
15
votes
4 answers
Angular2 ngFor OnPush Change Detection with Array Mutations
I have a data table component ( angular2-data-table ) project where we changed the project from Angular's traditional change detection to OnPush for optimized rendering speeds.
Once the new change detection strategy was implemented, a bug was filed…

amcdnl
- 8,470
- 12
- 63
- 99
15
votes
1 answer
Prevent a native browser event ( like scroll ) from firing change detection
I'm binding an scroll event to capture the scroll and do something with it, I've created a directive like bellow :
So I have simple directive which has nothing but :
constructor ( private el : ElementRef ,
private…

Milad
- 27,506
- 11
- 76
- 85
14
votes
1 answer
Will using Angular Reactive Forms .get() method in template cause unnecessary method calls like a component method?
I know that if I use a method call in a template it will get executed over and over (not ideal). I have solved that by using a combination of pure pipes and memoized methods. But I am also using reactive forms and in my template using the…

MrUnderhill
- 143
- 1
- 5