otro - pasar parametros entre componentes angular 4

llamar a una función en un componente de otro componente

Question

En Angular2, supongamos que tengo component1 (utilícelo como navegador de panel izquierdo) y component2. Estos dos componentes no están relacionados entre sí (hermano, padre e hijo, ...). ¿Cómo puedo invocar una función en el componente 1 desde el componente 2? No puedo usar el enlace de eventos aquí.

Answer 1

El servicio compartido es una forma común de comunicación entre componentes no relacionados. Sus componentes necesitan usar una única instancia del servicio , por lo tanto, asegúrese de que se proporcione en el nivel raíz.

Servicio compartido:

@Injectable()
export class SharedService {

    componentOneFn: Function;

    constructor() { }
}

Componente uno:

export class ComponentOne {

    name: string = ''Component one'';

    constructor(private sharedService: SharedService) {
        this.sharedService.componentOneFn = this.sayHello;
    }

    sayHello(callerName: string): void {
        console.log(`Hello from ${this.name}. ${callerName} just called me!`);
    }
}

Componente dos:

export class ComponentTwo {

    name: string = ''Component two'';

    constructor(private sharedService: SharedService) {
        if(this.sharedService.componentOneFn) {
            this.sharedService.componentOneFn(this.name); 
            // => Hello from Component one. Component two just called me!
        }
    }
}

Esta publicación también puede ser útil: Angular 2 Interacción entre componentes usando un servicio