FullCalendar in Ionic3 with Angular 4

如何在Ionic 3和Angular 4的事件（例如，單擊）中初始化fullCalendar？FullCalendar in Ionic3 with Angular 4

設置可變日曆選項時，此代碼的工作：

calendarOptions: Object = { 
    fixedWeekCount: true, 
    editable: true 
    };

但是，當我打電話給函數，不工作：

buildCalendar(): void{ 
    this.calendarOptions: Object = { 
    fixedWeekCount: true, 
    editable: true 
    }; 
}

的HTML代碼，其中的日曆被稱爲

<angular2-fullcalendar 
      [options]="calendarOptions" 
      (initialized)="onCalendarInit($event)"></angular2-fullcalendar>

buildCalendar調用的角度代碼：

getAging(): void { 

    this.myProvider.getAging() 
     .subscribe(
     (response) => { 
//do something... 
     }, (error) => { 
     console.log(`Backend returned code ${error.status}, body was: ${error.error}`); 
     },() => { 
     console.log('aging complete'); 
     this.buildCalendar(); 
     } 
    ) 

    }

PS：getAging（）在頁面加載時被調用。

而我需要初始化fullCalender，從後端（API）加載數據後。

來源

2017-09-26 Erico Souza

那麼它是離子2還是離子3？而且你在離子中使用它真的很重要嗎？它是有角度的。什麼是buildCalendar，它叫什麼名字？而這個.calendarOptions是如何使用的？請提供http://stackoverflow.com/help/mcve。 – estus

@estus抱歉，我編輯我的問題。我提到了Ionic，因爲我不知道它是否有與Angular不同的操作。 –

將插件安裝到我的離子3後，我得到一個沒有這樣的文件calendar.js的問題。你是如何解決這個問題的？謝謝 – ACES

這個問題並非一般的FullCalendar，而是特定的angular2-fullcalendar組件及其工作方式。

如果是指this one，問題很明顯;它不會監視options輸入並使用setTimeout黑客來覆蓋輸入中的初始更改（並且此處不需要100 ms的延遲）。

由於該組件非常簡單，因此第一方根據自己的需求來實施它，而不是依賴第三方解決方案。

對於此特定組件，應使用ngIf。它有助於防止組件被編譯，直到選項準備好：

<angular2-fullcalendar *ngIf="calendarOptions" 
      [options]="calendarOptions" 
      (initialized)="onCalendarInit($event)"></angular2-fullcalendar>

來源

2017-09-26 18:56:45 estus

FullCalendar in Ionic3 with Angular 4

回答

相關問題