如何像 angular 中的 ajax 那样使异步为 false 7

Question

在我的项目中，我有一个完整的日历，其中包含从数据库动态加载的事件。当我尝试将事件添加到 calendar.But 时，它对我不起作用，因为我认为是 httpget 方法同步问题。我无法解决问题。

 this.events = [];
    this.holidayList = [];
    //this._holidayService.getHolidayArray().then(events => { this.events = events; });
    this._holidayService.getHolidayArray().subscribe((result: any[]) => {
      for (let i = 0; i < result.length; i++) {
        this.events.push({ "title": result[i].title, "start": result[i].start });
        //this.holidayModel = new Holiday;
        //this.holidayModel.start = result[i].start;
        //this.holidayModel.title = result[i].title;
        //this.holidayList.push(this.holidayModel);
      }
      //this.events = this.holidayList;
    });


 this.options = {
      plugins: [dayGridPlugin, timeGridPlugin, interactionPlugin],
      selectable: true,
      selectMirror: true,
      select: function (arg) {
        var start = arg.start.toString();
          var date = start.slice(8, 10);
          var year = start.slice(11, 15);
          var month = start.slice(4, 7);
          if (month === "Jan") month = '01';
          if (month === "Feb") month = '02';
          if (month === "Mar") month = '03';
          if (month === "Apr") month = '04';
          if (month === "May") month = '05';
          if (month === "Jun") month = '06';
          if (month === 'Jul') month = '07';
          if (month === 'Aug') month = '08';
          if (month === 'Sep') month = '09';
          if (month === 'Oct') month = '10';
          if (month === 'Nov') month = '11';
        if (month === 'Dec') month = '12';
        var fullDate = month + '/' + date + '/' + year;
          $("#holiday").val(fullDate);
          document.getElementById("btnCreate").innerHTML = "Save";
          document.getElementById("description").innerHTML = "";
          $('#description').val("");
          $("#toggler")[0].click();
          //calendar.unselect()
       },
      defaultDate: '2019-07-01',
      header: {
        left: 'prev,next',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
      },
      events: this.events

    }
  }


  getHolidayArray() {
    return this.ExecuteGet("api/HolidayCalendar/GetTitles");
  }

如果我尝试

this._holidayService.getHolidayArray().then(events => { this.events = events; });

一个错误"then doesn't exist on type observable"

Answer 1

假设您使用的是 RxJS 5.5 或更高版本。

试一试：

getHolidayArray() {
  return this.ExecuteGet("api/HolidayCalendar/GetTitles");
}

----

import { map } from 'rxjs/operators';

this.events = [];
this.holidayList = [];

this._holidayService.getHolidayArray()
  .pipe(
    map((result: any[]) => result.map(item => ({
      title: item.title,
      start: item.start
    })))
  )
  .subscribe((result: any[]) => this.events = result);

Answer 2

查看您发布的 link 的 'Change Detection' 部分 (https://www.primefaces.org/primeng/#/fullcalendar)。您不能只是推入事件数组。而是尝试在循环后重新创建 this.events。

this._holidayService.getHolidayArray().subscribe((result: any[]) => {
  const events = [];
  for (let i = 0; i < result.length; i++) {
    events.push({ "title": result[i].title, "start": result[i].start });
  }
  this.events = [...this.events, ...events];
});

如何像 angular 中的 ajax 那样使异步为 false 7

How to make asyn false like ajax in angular 7

typescript

angular

primeng-calendar

angular7