Display events to angular angular full calendar

Ionic Framework ionic-v3
1

calendar.html

 <full-calendar 
  defaultView="dayGridMonth"
  [plugins]="calendarPlugins"
  [weekends]="true"
   [events]="[
    	{ title: 'event 1', date: '2019-06-07' },
    { title: 'event 2', date: '2019-06-12' }
  ]"
 ></full-calendar>

and this how look

mycalend

everything is fine but ı want load event from json instead of “[events]” array and ı made service

schedule.ts

export class ScheduleProvider {

  constructor(public http: HttpClient) {
    console.log('Hello ScheduleProvider Provider');
  }

  getData():Observable<any[]>{
    return this.http.get<any[]>('url/events');
    
  }

}

this my json url/events

{“data”:[{“id”:1,“name”:"subject 1"“start_time”:“2019-07-21 00:00:00”},{“id”:2,“name”:"subject 2"“start_time”:“2019-07-28 00:00:00”},{“id”:3,“name”:"subject 3"“start_time”:“2019-07-30 00:00:00”}]}

calendar.ts

jsonEvents:any=[];

 ngOnInit(){

    this.svc.getData().subscribe(data=>this.jsonEvents=data);
    
  }

ı dont know how to display jsonEvents in calendar instead of events array . So please help me.

2

Change the binding from the string to the variable that you are setting from within the API call. Obviously, the data returned will have to match the format expected by the control. If not, you’ll have to massaging of the data.

3

sorry but ı didnt get you really can you give more explain

4

Replace the json that you have bound events to with the jsonEvents variable. In looking at the data returned from you API call, it appears that the fields are different than what appears within the inline JSON that events is bound to. I don’t know anything about this particular control.

If it were me, I would create a class whose fields match the fields of the control. I would then iterate over the data returned and create new objects for each entry. Those entries would be added to an array and that array would be assigned to jsonEvents.