angular-changedetection

Angular 6.0.1. This problem is manifesting itself inside a large application, but I created a simple component to try and see what is going on. The simple component has a simple template: {{myProp}} In the ngOnInit, I set this.myProp = 'hello'; and I see the word hello on screen as I would expect. So far so good. However, if I now try to update the value of myProp in a setTimeout , it never updates the UI: this.myProp = 'hello'; setTimeout(() => { this.myProp = 'goodbye'; }, 3000); The value shown in the UI is still hello . If I inject ChangeDetectorRef in my constructor and call cdr

Why is the view not being updated when a variable changes within a subscribe? I have this code: example.component.ts testVariable: string; ngOnInit() { this.testVariable = 'foo'; this.someService.someObservable.subscribe( () => console.log('success'), (error) => console.log('error', error), () => { this.testVariable += '-bar'; console.log('completed', this.testVariable); // prints: foo-Hello-bar } ); this.testVariable += '-Hello'; } example.component.html {{testVariable}} But the view displays: foo-Hello . Why won't it display: foo-Hello-bar ? If I call ChangeDetectorRef.detectChanges() within

I'd like to make some operation from parent component on child component after child component has been initialised. Parent: export class ParentComponent implements AfterViewInit { @ViewChild('child') childComponent: ChildComponent; ngAfterViewInit() { this.childComponent.domMethod('boo'); } } <p>parent</p> <app-child #child></app-child> Child: export class ChildComponent implements OnInit { constructor(private readonly cdr: ChangeDetectorRef,) { } public term = ''; public items; ngOnInit() { this.items = [ { name: 'foo' }, { name: 'bar' }, { name: 'baz' }, { name: 'boo' }, { name: 'zoo' }, ];