Categories
Angular Uncategorized

Angular ChangeDetectorRef

import { JsonPipe } from '@angular/common';
import { Component, VERSION, ViewChild, AfterViewInit , AfterViewChecked, AfterContentChecked, SimpleChanges ,OnChanges, ElementRef  } from '@angular/core';
import { ChildComponent } from './child/child.component';
import { ChangeDetectorRef } from '@angular/core';
@Component({  
   selector: 'my-app',  templateUrl: './app.component.html',  
   styleUrls: [ './app.component.css' ]
})
export class AppComponent implements AfterViewInit, AfterViewChecked {  
constructor(private cdRef:ChangeDetectorRef) {}  
@ViewChild(ChildComponent) hello:ChildComponent;  
@ViewChild('title') title: ElementRef;  
aname = 'Ajay' 
 name = 'Angular ' + VERSION.major; 
 xx:any;  
ngAfterViewInit() {   
   this.aname = this.hello.name  
}  
ngAfterViewChecked(){    
   this.aname = this.hello.name   
   //console.log(this.title.nativeElement.innerText)    
   this.cdRef.detectChanges();  
} 
ngAfterContentInit(){    
   console.log("after content init");   
   // this.aname = this.hello && this.hello.name  
}  
ngOnChanges(changes: SimpleChanges) {    
   console.log(changes)       
   this.xx = changes 
 }
}
import { JsonPipe } from '@angular/common';
import { Component, VERSION, ViewChild, AfterViewInit , AfterViewChecked, AfterContentChecked, SimpleChanges ,OnChanges, ElementRef  } from '@angular/core';
import { ChildComponent } from './child/child.component';
import { ChangeDetectorRef } from '@angular/core';
@Component({  
   selector: 'my-app',  templateUrl: './app.component.html',  
   styleUrls: [ './app.component.css' ]
})
export class AppComponent implements AfterViewInit, AfterViewChecked {  
constructor(private cdRef:ChangeDetectorRef) {}  
@ViewChild(ChildComponent) hello:ChildComponent;  
@ViewChild('title') title: ElementRef;  
aname = 'Ajay' 
 name = 'Angular ' + VERSION.major; 
 xx:any;  
ngAfterViewInit() {   
   this.aname = this.hello.name  
}  
ngAfterViewChecked(){    
   this.aname = this.hello.name   
   //console.log(this.title.nativeElement.innerText)    
   this.cdRef.detectChanges();  
} 
ngAfterContentInit(){    
   console.log("after content init");   
   // this.aname = this.hello && this.hello.name  
}  
ngOnChanges(changes: SimpleChanges) {    
   console.log(changes)       
   this.xx = changes 
 }
}