search

nekken / ng2-fullcalendar

95 stars 47 forks source link

fullcalender angular 2 #17

Closed sam-rusty closed 7 years ago

sam-rusty commented 7 years ago

Hello, I'm facing a problem while using this fullcalender in angular 2. I followed same steps and got EXCEPTION: Cannot read property 'length' of null Here in my ts file `import {Component, OnInit,ViewEncapsulation} from '@angular/core'; import {coreService} from './../../services/core.service'; import {CalendarComponent} from "angular2-fullcalendar/src/calendar/calendar"; declare let jquery: any; declare let moment: any; @Component({ templateUrl: './events.html', styleUrls: ['./../../../assets/calender/fullcalender.css'], encapsulation: ViewEncapsulation.None, providers: [coreService, CalendarComponent] }) export class EventsComponent implements OnInit { calendarOptions:Object = { height: 'parent', fixedWeekCount: false, defaultDate: '2016-09-12', editable: true, eventLimit: true, // allow "more" link when too many events events: [ { title: 'All Day Event', start: '2016-09-01' }, { title: 'Long Event', start: '2016-09-07', end: '2016-09-10' }, { id: 999, title: 'Repeating Event', start: '2016-09-09T16:00:00' }, { id: 999, title: 'Repeating Event', start: '2016-09-16T16:00:00' }, { title: 'Conference', start: '2016-09-11', end: '2016-09-13' }, { title: 'Meeting', start: '2016-09-12T10:30:00', end: '2016-09-12T12:30:00' }, { title: 'Lunch', start: '2016-09-12T12:00:00' }, { title: 'Meeting', start: '2016-09-12T14:30:00' }, { title: 'Happy Hour', start: '2016-09-12T17:30:00' }, { title: 'Dinner', start: '2016-09-12T20:00:00' }, { title: 'Birthday Party', start: '2016-09-13T07:00:00' }, { title: 'Click for Google', url: 'http://google.com/', start: '2016-09-28' } ] };

constructor(protected coreService: coreService) {
    this.coreService.sendRequest("events/getEvents").subscribe(res=> {
        // this.calendarOptions.events = res.list;
    });
}
ngOnInit() {
    require('./../../../assets/calender/moment.min');
    require('./../../../assets/calender/fullcalender.min');
}

} Here, I'm simply using events array that is given in the documentation but still it is not working. I have to use json array that is coming from another file in json format. I also changed the code like this : public calendarOptions = { // code // }` then i got the error EXCEPTION: Cannot read property 'each' of null

Here is my module `import {NgModule} from '@angular/core'; import {RouterModule} from '@angular/router'; import {EventsComponent} from './../../components/events'; import {CalendarComponent} from "angular2-fullcalendar/src/calendar/calendar";

@NgModule({ imports: [ SharedModule, RouterModule.forChild([ { path: '', component: EventsComponent } ]),

],
declarations: [EventsComponent,CalendarComponent]

}) export class EventsModule {

} Here is my tsconfig.json file { "compilerOptions": { "declaration": false, "emitDecoratorMetadata": true, "experimentalDecorators": true, "lib": ["es6", "dom"], "mapRoot": "./", "module": "es6", "moduleResolution": "node", "outDir": "../dist/out-tsc", "sourceMap": true, "target": "es5", "typeRoots": [ "../node_modules/@types" ] } } Here is my package.json file { "name": "dep", "version": "0.0.0", "license": "MIT", "angular-cli": {}, "scripts": { "start": "ng serve", "lint": "tslint \"src/*/.ts\"", "test": "ng test", "pree2e": "webdriver-manager update", "e2e": "protractor" }, "private": true, "dependencies": { "@angular/common": "~2.1.0", "@angular/compiler": "~2.1.0", "@angular/core": "~2.1.0", "@angular/forms": "~2.1.0", "@angular/http": "~2.1.0", "@angular/platform-browser": "~2.1.0", "@angular/platform-browser-dynamic": "~2.1.0", "@angular/router": "~3.1.0", "angular-calendar": "^0.7.2", "angular2-fullcalendar": "^1.1.1", "@types/jquery": "^2.0.34", "@types/moment": "^2.11.29", "angular2-modal": "^2.0.2", "core-js": "^2.4.1", "rxjs": "5.0.0-beta.12", "ts-helpers": "^1.1.1", "zone.js": "^0.6.23" }, "devDependencies": { "@types/jasmine": "^2.2.30", "@types/node": "^6.0.42", "angular-cli": "1.0.0-beta.19-3", "codelyzer": "1.0.0-beta.1", "jasmine-core": "2.4.1", "jasmine-spec-reporter": "2.5.0", "karma": "1.2.0", "karma-chrome-launcher": "^2.0.0", "karma-cli": "^1.0.1", "karma-jasmine": "^1.0.2", "karma-remap-istanbul": "^0.2.1", "protractor": "4.0.9", "ts-node": "1.2.1", "tslint": "3.13.0", "typescript": "~2.0.3", "webdriver-manager": "10.2.5" }`

shah-smit commented 7 years ago

Are you still having issue? Can we close this issue?