Angular выполнить метод для Component1, запущенный из component2 (несвязанные comps) - PullRequest
0 голосов
/ 05 августа 2020

У меня 2 компонента.

Component1 и Component2

В компоненте 1 у меня есть метод, который запускается пользователем

<div (click)="trigger('parameter here')">run trigger</div>

Затем в .ts:

trigger(param) {
    // Code to "param" to send to Component2 and run executeThis()
}

В компоненте 2 у меня есть другой метод:

executeThis(param) {
    console.log(param);
}

Эти 2 компонента не связаны.

Как я могу это сделать?

Ответы [ 3 ]

1 голос
/ 05 августа 2020

Вы можете использовать для этого услугу. В сервисе вы объявляете новый EventEmitter:

export class TriggerService
{
  public trigger = new EventEmitter<any>();
}

Затем в вашем компоненте 1 испустите событие, подобное этому:

trigger(param)
{
  this.triggerService.trigger.emit(param);
}

И в своем компоненте 2 подпишитесь на EventEmitter:

constructor()
{
   this.triggerService.trigger.subscribe(param => {
     this.param = param;
     this.executeThis();
   });
}

И параметр журнала в executeThis:

executeThis()
{
  console.log(this.param);
}
1 голос
/ 05 августа 2020

Вы должны вставить компонент 2 внутри компонента 1. Тогда ваша функция триггера станет

trigger(param) {
  this.component2.executeThis(param);
}

Component2 будет фактически службой. См. https://angular.io/guide/dependency-injection#injecting -services

Если component2 действительно является компонентом (ie с html), я бы переместил код, используемый обоими компонентами, в общую службу.

0 голосов
/ 05 августа 2020

Вы можете достичь этого, создав общую службу и используя метод установки средства доступа машинописного текста

shared.service.ts

import { Injectable } from '@angular/core';

@Injectable({
 providedIn: 'root'
})
export class SharedService {
sharedValue;

constructor() {}

set someValue(value) {
  this.sharedValue = value
 } 

get someValue() {
  return this.sharedValue
 }
}

значение набора компонентов 1

constructor(private service: SharedService) {} // inject service

 trigger(param) {
 // set value
 this.service.someValue = param
}

компонент 2 получает значение

constructor(private service: SharedService) {} // inject service

executeThis() {
  // get value
  console.log(this.service.someValue);
}
...