funzione chiamata angular2 del componente principale

Question

Ho un'app in cui ho un componente di caricamento in cui posso caricare un file. È incorporato nello body.component.

Al caricamento, deve utilizzare una funzione (ad esempio BodyComponent.thefunction()) del componente principale (effettuare una chiamata per aggiornare i dati): ma solo se il genitore è in particolare lo body.component. Il caricamento potrebbe anche essere utilizzato altrove con un comportamento diverso.

Qualcosa come parent(this).thefunction(), come fare?

Answer 1

risposta obsolete

vorrei creare un evento personalizzato nel componente figlio. Qualcosa del genere:

@Component({ 
    selector: 'child-comp', 
    (...) 
}) 
export class ChildComponent { 
    @Output() 
    uploaded = new EventEmitter<string>(); 

    uploadComplete() { 
    this.uploaded.emit('complete'); 
    } 

Il componente genitore potrebbe registrarsi su questo evento

@Component({ 
    template ` 
    <child-comp (uploaded)="someMethod($event)"></child-comp> 
    `, 
    directives: [ ChildComponent ] 
}) 
export class ParentComponent { 
    (...) 

    someMethod(event) { 
    } 
} 

altro modo sarebbe quello di iniettare il componente principale del figlio unico, ma sarà fortemente collegati tra loro ...

Answer 2

È possibile inserire il componente principale nel componente figlio.

Per maggiori dettagli vedere
- How do I inject a parent component into a child component?
- Angular 2 child component refers to parent component In questo modo è possibile garantire che thefunction() viene chiamato solo quando genitore è un body.component.

In caso contrario è preferibile utilizzare @Output() per comunicare da figlio a padre.

Answer 3

Di seguito è lavorato per me in ultima

Angular5

class ChildComponent { 
    @Output() myEvent = new EventEmitter<string>(); 

    callParent() { 
    this.myEvent.emit('eventDesc'); 
    } 
} 

Nel modello ParentTemplate 's

<child-component (myEvent)="anyParentMehtod($event)"