Angular 在组件之间使用带参数的回调函数

有人能告诉我如何更改scheduler.component.ts的这部分吗

events: (start: any, end: any, timezone: any, callback: any) => {
                    callback(this.events);
                }

以及cal.component.ts的这一部分：

events: (start: any, end: any, timezone: any, callback: any) => {
                    callback(this.events);
                }

this.events=this.getEvents（）；

因此，我可以在cal.component.ts中的函数getEvents（）中调用方法： this.BookingService.getBookings（this.ip，start，end）。订阅(

而不是 this.BookingService.getBookings（this.ip）.订阅(

下面的所有代码现在都正常工作 但如果日历显示从开始日期到结束日期的范围，我不想加载所有预订。在scheduler.component.ts中正确设置了参数start和end

下面我只放了应用程序的重要部分：

cal.component.html

scheduler.component.ts

events: (start: any, end: any, timezone: any, callback: any) => {
  this.myService.getEvents(start, end);
  callback(this.events);
}

@组成部分({
选择器：“ds3计划”，
样式：['./cal.component.css']，
模板：“”
})
导出类SchedulerComponent在ViewInit、OnDestroy和DoCheck之后实现{
@Input（）事件：任意[]；
ngAfterViewInit（）{
this.schedule=jQuery（this.el.nativeElement）；
if（此.schedule.fullCalendar）{
此为.schedule.fullCalendar({
事件：（开始：任意、结束：任意、时区：任意、回调：任意）=>{
回调（this.events）；
}
}

cal.component.ts

events: (start: any, end: any, timezone: any, callback: any) => {
  this.myService.getEvents(start, end);
  callback(this.events);
}

@组件({
选择器：“ds计划”，
样式：['./cal.component.css']，
templateUrl:“./cal.component.html”，
//changeDetection:ChangeDetectionStrategy.OnPush，
供应商：[
客户服务，
CalService，
预订服务
]
})
恩戈尼尼特（）{
this.optionConfig={}
this.header={
左：“上一个，下一个今天”，
中心：'标题'，
右图：“timelineMonth，timelineYear”
};
this.events=this.getEvents（）；
this.resources=this.getResources（）；
}
getEvents（）：MyEvent[]{
var事件：MyEvent[]=[]；
此.ipservice.getIP（）.subscribe(
d=>{
这个ip=d；
this.BookingService.getBookings（this.ip）.订阅(
数据=>{
这是。预订=数据；
this.bookings.forEach（booking=>{
events.push（this.bookingToEvent（booking））；
});
}
)
}
);
返回事件；
}

当用户单击prev/next或切换视图时，会触发

事件

功能，您需要通过发送带有开始/结束筛选器的请求来再次获取事件，或者如果后端不支持，则必须在客户端进行

我不确定

CalComponent

和

SchedulerComponent

（可能是父子关系？）之间的关系是什么，但它们需要使用EventEmitter相互通信，或者将

getEvents

函数导出到服务中，并在需要时调用它

服务解决方案的示例：

在scheduler.component.ts中

events: (start: any, end: any, timezone: any, callback: any) => {
  this.myService.getEvents(start, end);
  callback(this.events);
}

---

为我服务

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

@Injectable({
  providedIn: 'root',
})
export class MyService{

  constructor() { }

  getEvents(start?: number, end?: number){
    var events: MyEvent[] = [];
    this.ipservice.getIP().subscribe(
    d => {
      this.ip = d;
      this.BookingService.getBookings(this.ip, start, end).subscribe(
        data => {
          this.bookings = data;
          this.bookings.forEach(booking => {
            events.push(this.bookingToEvent(booking));
          });
        }
      )
    });
    return events;
  }
}

---

请不要忘记处理

预订服务中
开始
和
结束
的
未定义的
值，谢谢，但问题可能在其他地方。我尝试发出事件，一开始看起来很有希望。在scheduler.component中，我添加了：

事件：（开始：任意，结束：任意，时区：任意，回调：任意）=>{
emit（{start，end}）；
回调（this.events）；
}

然后在我的html视图中添加（onCallendarChange）：



在cal.component中：

ngOnInit（）{
this.events=this.getEvents（矩（）.date（1），矩（）.date（31））；
}
onCallendarChange（事件：任意）：无效{
this.start=event.start；
this.end=event.end；
this.events=this.getEvents（this.start，this.end）；
}

效果如下：


页面加载后，我有当月的记录

在发出月更改事件后，我可以在cal.component中看到新值

回调后scheduler.component中this.events（this.events）中的值不会更改。仍然有来自ngOnInit（）的结果


我尝试用新的空对象重新初始化。事件，但随后我得到无限循环，记录开始加载并一直重置。我可以在页面上看到，在月份更改后，我得到了新数据，但我无法停止此事件循环

我也尝试了第二种方法（通过服务），但结果类似。无限循环

这两个组件彼此不直接使用。它们通过html视图连接。
我在地狱里呆了一段时间，尝试了不同的方法。这是使用Observable，但变化不大

scheduler.component.ts
事件：（开始：任意，结束：任意，时区：任意，回调：任意）=>{
this.getEvents（开始、结束）.subscribe（evnt=>{
控制台日志（evnt）{
console.log（this.events）{
this.getEvents（开始、结束）.subscribe（evnt=>{
this.events=evnt；{…是我唯一可以获得开始和结束的地方，但它不是我可以更改this.events值的地方