Angular2 Abhängigkeitsinjektion vs @ViewChild

Question

Ich frage mich, was der Unterschied zwischen der Verwendung der Abhängigkeit Injektion Komponente und @ViewChild. Die beiden Möglichkeiten, die ich verwenden kann, die Methoden der Elternattribute. Also, wann sollte ich eins und anderes?

Dependency Injection

import { Component, OnInit } from '@angular/core'; 
import { CompB } from './compb/compb.component'; 

@Component({ 
    moduleId: module.id, 
    selector: 'app-test', 
    templateUrl: 'compA.html' 
}) 
export class CompAComponent implements OnInit { 

    constructor(private _compB: CompB) { 
    } 
    ngOnInit() { 
     this._compB.getName(); 
    } 

} 

@Component({ 
    moduleId: module.id, 
    selector: 'app-test', 
    templateUrl: 'compB.html' 
}) 
export class CompBComponent { 
    getName() { 
     return 'Hello World'; 
    } 
} 

@ViewChild

import { Component, OnInit } from '@angular/core'; 
import { CompB } from './compb/compb.component'; 

@Component({ 
    moduleId: module.id, 
    selector: 'app-test', 
    templateUrl: 'compA.html' 
}) 
export class CompAComponent implements OnInit { 
    @ViewChild(CompB) compB: CompB 
    ngOnInit() { 
     this._compB.getName(); 
    } 

} 

@Component({ 
    moduleId: module.id, 
    selector: 'app-test', 
    templateUrl: 'compB.html' 
}) 
export class CompBComponent { 
    getName() { 
     return 'Hello World'; 
    } 
} 

Wie Sie sehen können, die beide Methoden Ich habe Zugriff auf die getName() in compBComponent.

Answer 1

Ich denke, die Namen genug offensichtlich sein sollte ...

@ViewChild gibt Ihnen den Hinweis auf eine tatsächliche Ansicht Kind in Ihrer Ansicht erstellt. Die Lebensdauer des Kindes hängt vollständig von der Lebensdauer der aktuellen Komponente ab.

Injectable component gibt Ihnen das Objekt der angegebenen Klasse zurück (das eine Komponente zu sein scheint), das von Angulars DI-Modul erstellt wurde. Die Lebensdauer dieses Objekts wird von der DI-Regel von Angular verwaltet (die Sie hier eingeben).

In Ihrem Beispiel gibt es keinen Unterschied, denn ein Component kann ein injizierbares Objekt sein, und Ihre getName Funktion gehört eher zu einem Dienst, nicht zu einer Komponente. Component ist ein sichtbares Modul, das Informationen für Benutzer anzeigt oder Informationen von ihnen zurücknimmt. Lassen Sie uns ein anderes Beispiel nehmen, wo Sie eine Eingabe in Ihrem compBComponent haben, die es dem Benutzer erlaubt, den neuen Namen einzugeben, und getName wird ohne Benutzereingaben aus dem Zusammenhang geraten. In diesem Fall wird DI compBComponent irrelevant.

Plunker zu spielen mit (Stand zu Final): http://plnkr.co/edit/dn9CiGUrswW2FQgLPWwW