Search code examples
angularinheritancedependency-injectionangular-changedetection

ChangeDetectorRef instance in Angular


I have one component and one regular TypeScript class in an Angular project. The component extends the class. Both have an independent instance of ChangeDetectorRef. Something like this:

import { ChangeDetectorRef } from '@angular/core';

export class MySuperClass {
    private cdr: ChangeDetectorRef;
    constructor() {}
    // .. other code here
}

And in another file:

import { ChangeDetectorRef } from '@angular/core';

export class MyComponent extends {
    @Component({...})

    constructor(private cdr: ChangeDetectorRef) {
        super();
    }
    // .. other code here
}

What confuses me is that the instance of ChangeDetectorRef that is used form the super class works even though it is neither injected nor instantiated explicitly.

Is this behavior due to nature of ChangeDetectorRef or the nature of how inheritance works in TypeScript, or something completely else?


Solution

  • When angular injects

    private cdr: ChangeDetectorRef
    

    into MyComponent it actually runs over the the same param his father have.

    If you create an instance of MySuperClass alone or if you change MySuperClass's cdr param name they both won't hold the same ChangeDetectorRef context