如何通过 Syncfusion Angular 调度程序上的 Ajax post 数据自定义 API

Question

我目前正在尝试弄清楚如何在使用编辑器 window 创建事件时 post 数据到我的 API。我使用 Ajax 来检索内容，如下所示；

const ajax: Ajax = new Ajax(
  "https://localhost:3486/api/CalendarEvents?StartDate=" + startDate + "&EndDate=" + endDate,
  "GET",
  true
);
ajax.send().then();
ajax.onSuccess = (data: string): void =>
{
  this.scheduler.eventSettings = {
    dataSource: JSON.parse(data).map((value, index) => ({
      id: index,
      Subject: value.title,
      StartTime: value.startDate,
      EndTime: value.startDate
    })),
    fields: {
    }
  };
};
ajax.onFailure = (): void  =>
{

};

此外，当用户通过视图或日期导航更改调度程序上的日期时，如何获取当前选择的日期范围。

onActionComplete(args: ActionEventArgs): void {
    if (args.requestType == "dateNavigate") {
      // how to get current date range ?
    }
}

[更新] 找到如何获取当前选择的日期范围：

onActionComplete(args: ActionEventArgs): void {
    if (args.requestType === "viewNavigate" || args.requestType === "dateNavigate") {
      const currentDates: Date[] = this.scheduleObj.getCurrentViewDates();
      const startDate = currentDates[0];
      const endDate = currentDates[currentDates.length - 1];
    }
  }

Answer 1

我们已经验证了您报告的查询“如何通过 Ajax 在 Synfusion Angular Scheduler 上 post 数据自定义 API”，并准备了示例和服务供您参考.

app.component.ts:  
  myClickFunction(args: any): void {
    let schObj = (document.querySelector('.e-schedule') as any)
      .ej2_instances[0];
    const ajax = new Ajax('http://localhost:54738/Home/GetData', 'GET', false);
    ajax.onSuccess = (data: any) => {
      schObj.eventSettings.dataSource = JSON.parse(data);
    };
    ajax.send();
  }
  onBegin(args: any): void {
    if (args.requestType === 'eventCreate') {
      this.temp = true;
      let schObj = (document.querySelector('.e-schedule') as any)
        .ej2_instances[0];
      const ajax = new Ajax(
        'http://localhost:54738/Home/Insert',
        'POST',
        false
      );
      ajax.data = JSON.stringify(args.data[0]);
      ajax.onSuccess = (data: any) => {
        schObj.eventSettings.dataSource = JSON.parse(data);
      };
      ajax.send();
    } else if (args.requestType === 'eventChange') {
      let schObj = (document.querySelector('.e-schedule') as any)
        .ej2_instances[0];
      const ajax = new Ajax(
        'http://localhost:54738/Home/Update',
        'POST',
        false
      );
      ajax.data = JSON.stringify(args.data);
      ajax.onSuccess = (data: any) => {
        schObj.eventSettings.dataSource = JSON.parse(data);
      };
      ajax.send();
    }
  }

样本：https://stackblitz.com/edit/angular-schedule-custom-adaptor?file=app.component.ts 服务：https://www.syncfusion.com/downloads/support/directtrac/344913/ze/Service-285380590

如何通过 Syncfusion Angular 调度程序上的 Ajax post 数据自定义 API

How to post data to custom API via Ajax on Synfusion Angular Scheduler

angular

typescript

syncfusion

ej2-syncfusion