Thread ID: |
Created: |
Updated: |
Platform: |
Replies: |
143368 | Mar 17,2019 07:20 AM UTC | Mar 20,2019 09:06 AM UTC | Ionic | 1 |
![]() |
Tags: ejSchedule |
System.config({
paths: {
'npm:': './node_modules/',
'syncfusion:': 'npm:@syncfusion/'
},
map: {
app: 'app',
//Syncfusion packages mapping
"@syncfusion/ej2-base": "syncfusion:ej2-base/dist/ej2-base.umd.min.js",
"@syncfusion/ej2-data": "syncfusion:ej2-data/dist/ej2-data.umd.min.js",
"@syncfusion/ej2-inputs": "syncfusion:ej2-inputs/dist/ej2-inputs.umd.min.js",
"@syncfusion/ej2-popups": "syncfusion:ej2-popups/dist/ej2-popups.umd.min.js",
"@syncfusion/ej2-buttons": "syncfusion:ej2-buttons/dist/ej2-buttons.umd.min.js",
"@syncfusion/ej2-splitbuttons": "syncfusion:ej2-splitbuttons/dist/ej2-splitbuttons.umd.min.js",
"@syncfusion/ej2-lists": "syncfusion:ej2-lists/dist/ej2-lists.umd.min.js",
"@syncfusion/ej2-calendars": "syncfusion:ej2-calendars/dist/ej2-calendars.umd.min.js",
},
packages: {
'app': { main: 'app', defaultExtension: 'js' }
}
});
"dependencies": {
"@angular/common": "~7.0.0",
. . . . .
"@ionic/angular": "4.0.0-rc.0",
"@syncfusion/ej2": "^16.4.42",
"@syncfusion/ej2-angular-schedule": "^16.4.42",
"core-js": "^2.5.4",
"rxjs": "~6.3.3",
"zone.js": "~0.8.26"
} |
import { IonicModule } from '@ionic/angular';
. . . . .
import { ScheduleAllModule } from '@syncfusion/ej2-angular-schedule;
import { Tab1Page } from './tab1.page';
@NgModule({
imports: [
IonicModule,
CommonModule,
ScheduleAllModule,
FormsModule,
RouterModule.forChild([{ path: '', component: Tab1Page }])
],
declarations: [Tab1Page]
})
export class Tab1PageModule {} |
@import '~@ionic/angular/css/padding.css';
. . . .
|
<ejs-schedule width='100%' height='650px' [selectedDate]='selectedDate' [eventSettings]='eventSettings'>
</ejs-schedule> |
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-tab1',
templateUrl: 'tab1.page.html',
styleUrls: ['tab1.page.scss']
})
export class Tab1Page implements OnInit {
public data: Object[];
public selectedDate;
public eventSettings;
ngOnInit() {
this.selectedDate = new Date(2018, 3, 1);
this.data = [{
Id: 1,
Subject: 'Explosion of Betelgeuse Star',
StartTime: new Date(2018, 3, 2, 9, 30),
EndTime: new Date(2018, 3, 2, 11, 0),
AirlineId: 1
}];
this.eventSettings = {dataSource : this.data };
}
} |
This post will be permanently deleted. Are you sure you want to continue?
Sorry, An error occured while processing your request. Please try again later.
This page will automatically be redirected to the sign-in page in 10 seconds.