Функции запуска в разных компонентах одним нажатием кнопки через сервис в Angular?

Question

У меня есть панель инструментов, где я могу вводить данные в компонент, и данные собираются в mongoDB.Затем я получаю эти данные в других компонентах и ​​отображаю их на том же сайте.Теперь у меня есть кнопка обновления под каждым компонентом, чтобы я мог вручную обновить каждый компонент.Но я хочу сделать это в тот момент, когда я отправляю свои данные на mongodb.

Я попробовал это с сервисом, но это не сработало очень хорошо

Это должно быть обновлено

import { UpdateServicenter code heree} from "../../../@core/data/update.service";

constructor(private http: HttpClient, private updateService: UpdateService,) {
              //load it the first time if you refreshing the site
              this.updateOrders();
              //this should call updateOrders again if button is clicked
              this.updateService.updateData()
}

updateOrders() {
              //here I get the data from mongoDB and set it in my variables
}

Кнопка (эта функция вызывается, если я нажимаю кнопку)

import { UpdateService} from "../../../@core/data/update.service";

constructor(private http: HttpClient,private updateService: UpdateService){}          
submitButton(){
              this.updateService.updateData()
}

Сервис

@Injectable()

export class UpdateService {
   updateData(){
        //this should call the function updateOrders()
   }
}

Я хочу создать сервис, который может вызывать каждую функцию или вызываться при нажатии кнопки, потому что у меня более одного компонента, который должен быть обновлен.

Answer 1

Отлично.Переместите этот метод в службу, сохраните ваши данные в переменных в службе, а затем передайте данные в качестве входных данных каждому компоненту, например, ловушка жизненного цикла ngOnChanges будет срабатывать при каждом обновлении данных.например,

@Injectable()

export class UpdateService {
   public obj; //variable you save your data

   updateOrders() {
             this.someObj = this.http<>.....
  }
 getObj():{
  // do your stuff here if you need so
   return this.obj;
  }
}

<someComp [obj]="updateService.getObj()"></someComp>

export class SomeComponent {
   @Input()
   public obj;

   ngOnChanges(changes:SimpleChanges){
      //do your stuff here if you need so, or hust send them to html
    }
}

Answer 2

метод updateOrders () - это вызов http, где вы получаете наблюдаемый объект?