कोणीय 2 में निर्भरता इंजेक्शन के साथ एक घटक का विस्तार कैसे करें?

Question

मैं निम्नलिखित वर्ग ModuleWithHttp है:

@Injectable() 
export default class { 
    constructor(private fetchApi: FetchApi) {} 
} 

और इस प्रकार मैं इसे उपयोग करना चाहते हैं:

@Component({ 
    selector: 'main', 
    providers: [FetchApi] 
}) 
export default class extends ModuleWithHttp { 
    onInit() { 
    this.fetchApi.call(); 
    } 
} 

तो एक सुपर वर्ग कि पहले से ही एक निर्भरता मैं करने के लिए एक एक्सेस प्राप्त करना चाहते injects बढ़ा कर यह अपने बच्चों में है।

मैं कई अलग अलग तरीकों की कोशिश की, यहां तक ​​कि एक घटक के रूप में सुपर स्तरीय होने:

@Component({ 
    providers: [FetchApi] 
}) 
export default class { 
    constructor(private fetchApi: FetchApi) {} 
} 

लेकिन फिर भी, this.fetchApi, null है इससे भी अधिक सुपर क्लास में।

Answer 1

आप सुपर क्लास में fetchAPI इंजेक्षन और बच्चे वर्ग

export default class extends ModuleWithHttp { 

    constructor(fetchApi: FetchApi) { 
    super(fetchApi); 
    } 

    onInit() { 
    this.fetchApi.call(); 
    } 
} 

यह कैसे डि सामान्य रूप में काम करता है की एक विशेषता है के लिए नीचे पारित करने के लिए की है। सुपर क्लास विरासत के माध्यम से बच्चे को तुरंत चालू करेगी, लेकिन आपको बच्चे को आवश्यक पैरामीटर देना होगा।

Answer 2

तुम सिर्फ माता-पिता वर्गों 'निर्माता में इंजेक्शन के लिए बच्चे कक्षाओं में सेवाएं इंजेक्शन लगाने और फिर प्रभावी ढंग से उपयोग विरासत के माध्यम से बच्चे कक्षाओं में सेवाओं, आप यह कर सकता है कि इस "बॉयलर प्लेट" कोड से बचना चाहते हैं:

संपादित करें: कोणीय 5.0.0 ReflectiveInjector से StaticInjector के पक्ष में पदावनत किया गया है, नीचे इस बदलाव

deps के साथ एक सेवा मानचित्र है प्रतिबिंबित करने के लिए कोड अद्यतन किया जाता है,

export const services: {[key: string]: {provide: any, deps: any[], useClass?: any}} = { 
    'FetchApi': { 
    provide: FetchApi, 
    deps: [] 
    } 
} 

एक इंजेक्टर धारक,

import {Injector} from "@angular/core"; 

export class ServiceLocator { 
    static injector: Injector; 
} 

सेट यह AppModule में,

@NgModule(...) 
export class AppModule { 
    constructor() { 
    ServiceLocator.injector = Injector.create(
     Object.keys(services).map(key => ({ 
     provide: services[key].provide, 
     useClass: services[key].provide, 
     deps: services[key].deps 
     })) 
    ); 
    } 
} 

माता पिता कक्षा में इंजेक्टर का उपयोग करें,

export class ParentClass { 

    protected fetchApi: FetchApi; 

    constructor() { 
    this.fetchApi = ServiceLocator.injector.get(FetchApi); 
    .... 
    } 
} 

है और माता पिता के वर्ग का विस्तार तो तुम नहीं FetchApi सेवा इंजेक्षन करने की आवश्यकता है।

export class ChildClass extends ParentClass { 
    constructor() { 
    super(); 
    ... 
    } 

    onInit() { 
    this.fetchApi.call(); 
    } 
} 

Answer 3

हो सकता है कि देर से प्रतिक्रिया है, लेकिन मैं BaseComponent पर और सभी उपवर्गों में केवल इंजेक्टर, कि जिस तरह से मैं एक सेवा लोकेटर बनाए रखने के लिए की जरूरत नहीं है इंजेक्शन लगाने का संकल्प लिया था।

मेरे आधार वर्ग:

constructor(private injectorObj: Injector) { 

    this.store = <Store<AppState>>this.injectorObj.get(Store); 
    this.apiService = this.injectorObj.get(JsonApiService); 
    this.dialogService = this.injectorObj.get(DialogService); 
    this.viewContainerRef = this.injectorObj.get(ViewContainerRef); 
    this.router = this.injectorObj.get(Router); 
    this.translate = this.injectorObj.get(TranslateService); 
    this.globalConstantsService = this.injectorObj.get(GlobalConstantsService); 
    this.dialog = this.injectorObj.get(MatDialog); 
    this.activatedRoute = this.injectorObj.get(ActivatedRoute); 
} 

मेरा बच्चा क्लास:

constructor(private injector: Injector) { 

    super(injector); 

}