Angular 2: von der untergeordneten Komponente direkt an die Skriptdatei der übergeordneten Komponente ausgeben

Question

Ich habe eine verschachtelte Komponente, die einige Daten direkt an die Typoskriptdatei der Eltern senden möchte, ohne die Vorlage zu durchlaufen. kann ich nicht verwenden<child (childEvent)="parentFunc()"></child>

Ist das möglich? Wenn das so ist, wie?

Dies ist der aktuelle Stand der Dinge.

parent.component.html (das Element muss das sein)

<child #child> </child> 

parent.component.ts

@ViewChild('child') public child; 

public doSomething() { 
    this.child.work(); 
} 

public doThisWhenChildEmits(someData) { 
    //?????How do I call this function from child without going through the DOM 
    alert(It worked) 
} 

child.component.ts

@Output() private childEvent: EventEmitter<any> = new EventEmitter() 
... 
public work() { 
    // does some work that changes the child's template 
} 

public clickToSendBack(){ 
    // click event that sends back to parent.component directly???? 
    this.childEvent.emit(someData); 
} 

Answer 1

Wenn Sie nicht verwenden möchten @Output könnten Sie Subject statt:

Ihre Eltern auf Veränderungen zeichnen würde. In Ihren Eltern, ein Thema in der Komponente deklariert und im Konstruktor auf Änderungen abonnieren:

public static changesMade: Subject<any> = new Subject(); 

//inside constructor the following 
ParentComponent.changesMade.subscribe(res => { 
    //call your method here, with the res (someData) you receive from child 
    this.doThisWhenChildEmits(res); 
}); 

und in Ihrem Kind:

public clickToSendBack(){ 
    // send the data to parent 
    ParentComponent.changesMade.next(someData) 
} 

Lassen Sie mich wissen, ob das hilft! :)