Tengo una aplicación donde tengo un componente de carga donde puedo cargar un archivo. Está incrustado en el body.component
.
En la carga, debe usar una función (por ejemplo BodyComponent.thefunction()
) del componente principal (hacer una llamada para actualizar los datos): pero solo si el padre es específicamente el body.component
. La carga también puede usarse en otros lugares con un comportamiento diferente.
Algo como parent(this).thefunction()
, ¿cómo hacer eso?
angular2/core
. El registro de la consola muestra un problema con angular2-polyfills@Ouput
lugar de@Output
. Podría ser el problema ... Actualicé mi respuesta.uploadComplete is not defined
nota de que los copié como ejemplos. El padre también tiene "someMethod", pero ya tiene un problema conuploadComplete
. El componente principal usa el enlace (cargado) en el nodo secundario, y ya tenía el elemento secundario como directiva.A continuación se trabajó para mí en la última
Angular5
class ChildComponent { @Output() myEvent = new EventEmitter<string>(); callParent() { this.myEvent.emit('eventDesc'); } }
En
ParentTemplate
la plantilla<child-component (myEvent)="anyParentMehtod($event)"
fuente
Solución sin eventos de por medio.
Supongamos que tengo un
ChildComponent
y de ahí quiero llamar al método almyMethod()
que perteneceParentComponent
(manteniendo el contexto del padre original).Clase de componente principal:
Plantilla principal:
Plantilla infantil
fuente
this.myMethod.bind(this)
se devuelve. (Posiblemente, en cambio, estoy haciendo algo fundamentalmente mal.)Puede inyectar el componente principal al componente secundario.
Para obtener más detalles, consulte
- ¿Cómo inyecto un componente principal en un componente secundario?
- El componente secundario de Angular 2 se refiere al componente principal. De esta manera, puede asegurarse de que
thefunction()
solo se llame cuando el elemento principal seabody.component
.constructor(@Host() bodyComp: BodyComponent) {
De lo contrario,
@Output()
se prefiere usar para comunicarse de un niño a otro.fuente
constructor(@Host() bodyComp: BodyComponent)
... tal vez se cambió recientemente. ¡Funciona muy bien, gracias!