title: TypeError: Cannot read property 'ngDoCheck' of undefined in angular2
body: <p>In Child1 component, I have used <code>this.cdRef.detectChanges()</code> . But when I add Child2 component on the same parent component. Child2 component implements AfterViewInit . It gives me exception </p>
  
  <blockquote>
    <p>TypeError: Cannot read property 'ngDoCheck' of undefined in angular2. </p>
  </blockquote>
  
  <p>Please suggest the solution.</p>
  
  <pre><code>child1:
  
  export class MainFilterComponent implements AfterViewInit {
  
  constructor(){
   this.cdRef.detectChanges();
  }
  }
  
  
  Child2
  export class MainCompareComponent implements AfterViewInit {
   constructor(){
   }
  }
  
  
  
  
  export class MainFilterComponent implements AfterViewInit {
  
    countries: Country[] = [];
    filterToggled: boolean = false;
    filter: Filter;
    fromYears: Option[] = [];
    holder: any;
    institutions: Institution[] = [];
    isFullWidth: boolean;
    levels: Option[] = [];
    programs: Program[] = [];
    toYears: Option[] = [];
    stretchBox: any;
  
    @ViewChild('addBox') addBox: ElementRef;
    @ViewChild('chooselist') list: ElementRef;
  
  
    constructor(private translate: TranslateService, private filterService: FilterService, private zone: NgZone,
      private activatedRoute: ActivatedRoute, private router: Router, private elementRef: ElementRef, private renderer: Renderer, private cdRef: ChangeDetectorRef) {
      this.filter = filterService.getFilter();
      this.getCountries();
      this.getLevels();
      this.getInstitutions();
      this.getPrograms();
      this.getYears();
      this.updateFilterFromURL();
      this.filterService.onFilterChanged$.subscribe(filter =&gt; this.onFilterChanged(filter));
    }
  
  
    ngAfterViewInit(): void {
      jQuery.getScript('./app/components/filter/main-filter.js');
      this.holder = this.list.nativeElement.parentNode.parentNode.parentNode;
      this.stretchBox = this.holder.firstElementChild;
    }
  
  
   onFilterChanged(filter: Filter) {
      this.filter = filter;
      this.cdRef.detectChanges();
     if (this.list.nativeElement.children.length &gt; 0) {
       this.renderer.setElementClass(this.list.nativeElement, 'select', true);
     }
     else if (this.list.nativeElement.children.length === 0) {
       this.renderer.setElementClass(this.list.nativeElement, 'select', false);
     }
     this.refreshWidth();
  
    }
  
  
   refreshWidth() {
      var items = this.list.nativeElement.children;
      var listWidth = 0;
      for (var i = 0; i &lt; items.length; i++) {
        listWidth += $(items[i]).outerWidth(true);
      }
      var newWidth;
      if (!items.length || $(this.addBox.nativeElement).outerWidth(true) + (listWidth + ($(this.list.nativeElement).outerWidth(true) - $(this.list.nativeElement).width())) &gt; $(this.holder).width() * 0.7) {
        newWidth = '';
        this.isFullWidth = true;
      }
      else {
        this.isFullWidth = false;
        newWidth = Math.floor((100 - (($(this.addBox.nativeElement).outerWidth(true) + (listWidth +
          ($(this.list.nativeElement).outerWidth(true)
            - $(this.list.nativeElement).width()))) / $(this.holder).width() * 100)) - 1 /** 10*/) /*/ 10*/ + '%';
      }
      this.renderer.setElementStyle(this.stretchBox, 'width', newWidth);
    }
  </code></pre>