错误TS2305：模块＆＃39;＆quot; fullcalendar＆＃39;＆＃39;没有导出的成员＆＃39;选项＆＃39;。角

Question

我正在使用 fullCalendar＆amp;它在Angular 5中的fullcalendar-scheduler

app.module.ts

    import { CalendarModule } from "ap-angular2-fullcalendar";
@NgModule({
  imports: [
    CalendarModule,

home.component.ts

    import { CalendarComponent } from 'ap-angular2-fullcalendar';
    import * as $ from 'jquery';
    import 'fullcalendar';
    import 'fullcalendar-scheduler';

export class HomeComponent implements OnInit {

 calendarOptions: Object = {
    defaultView: 'agendaDay',

    header: {
      left: 'prev,next today',
      center: 'title',
      right: 'month,agendaWeek,agendaDay'
    },
    resources: [
      { id: 'a', title: 'Resource 1' },
      { id: 'b', title: 'Resource 2', eventColor: 'green' },
      { id: 'c', title: 'Resource 3', eventColor: 'orange' },
      { id: 'd', title: 'Resource 4', eventColor: 'red' }
    ],
    events: [
      { id: '1', resourceId: 'a', start: '2018-03-07T09:00:00', end: '2018-03-07T10:00:00', title: 'event 1' },
      { id: '2', resourceId: 'b', start: '2018-03-07T07:30:00', end: '2018-03-07T08:30:00', title: 'event 2' },
      { id: '3', resourceId: 'c', start: '2018-03-07T07:30:00', end: '2018-03-07T08:30:00', title: 'event 3' },
      { id: '4', resourceId: 'd', start: '2018-03-07T10:10:00', end: '2018-03-07T10:40:00', title: 'event 4' },
      { id: '5', resourceId: 'a', start: '2018-03-07T10:10:00', end: '2018-03-07T10:40:00', title: 'event 5' }
    ]
  };

我收到以下错误：

  

错误   node_modules / AP-angular2-fullcalendar / SRC /日历/ calendar.d.ts（3,10）：   错误TS2305：模块＆＃39;＆quot; fullcalendar＆＃39;＆＃39;没有导出的成员   ＆＃39;选项＆＃39 ;.   node_modules / fullcalendar调度器/ node_modules / fullcalendar / DIST / fullcalendar.d.ts（2525,10）：   错误TS2717：后续属性声明必须相同   类型。物业＆＃39; fullCalendar＆＃39;必须是＆＃39;日历＆＃39;，但在这里   有类型＆＃39;对象＆＃39;。

on

ng build

This solution does not worked for me

的package.json

 "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "postinstall": "rm -Rf ./node_modules/app-angular2-fullcalendar/node_modules"
  },

我们将非常感谢任何帮助。

Answer 1

我已经解决了这个问题。

错误：无法在Angular 5中添加完整日历，并显示以下错误。

  

错误   node_modules / AP-angular2-fullcalendar / SRC /日历/ calendar.d.ts（3,10）：   错误TS2305：模块''fullcalendar''没有导出成员   “选项”。   node_modules / fullcalendar调度器/ node_modules / fullcalendar / DIST / fullcalendar.d.ts（2525,10）：   错误TS2717：后续属性声明必须相同   类型。属性'fullCalendar'必须是'Calendar'类型，但这里有   输入'对象'。

问题：使用Typescript有一种不同的方式来使用全日历计划程序。它与AngularJs中的不一样

<强>解决方案：

第1步： 安装以下软件包

• npm install --save jquery fullcalendar fullcalendar-scheduler
• npm install --save-dev typescript webpack awesome-typescript-loader source-map-loader
• npm install --save-dev @ types / jquery

第2步： 在view / html中添加以下代码

<div id='calendar'></div>

第3步： 在component.ts

import * as $ from 'jquery';
import 'fullcalendar';
import 'fullcalendar-scheduler';

@Component({
  moduleId: module.id,
  templateUrl: 'calendar.view.html'
})
export class CalendarComponent implements OnInit {
  containerEl: JQuery = $('#calendar');;

ngOnInit() {

  calendarOptions: Object = {
    defaultView: 'agendaDay',
    editable: true,
    header: {
      left: 'prev,next today',
      center: 'title',
      right: 'month,agendaWeek,agendaDay'
    },
    resources: [
      { id: 'a', title: 'Resource 1' },
      { id: 'b', title: 'Resource 2', eventColor: 'green' },
      { id: 'c', title: 'Resource 3', eventColor: 'orange' },
      { id: 'd', title: 'Resource 4', eventColor: 'red' }
    ],
    events: [
      { id: '1', resourceId: 'a', start: '2018-04-18T09:00:00', end: '2018-04-18T10:00:00', title: 'event 1' },
      { id: '2', resourceId: 'b', start: '2018-04-18T07:30:00', end: '2018-04-18T08:30:00', title: 'event 2' },
      { id: '3', resourceId: 'c', start: '2018-04-18T07:30:00', end: '2018-04-18T08:30:00', title: 'event 3' },
      { id: '4', resourceId: 'd', start: '2018-04-18T10:10:00', end: '2018-04-18T10:40:00', title: 'event 4' },
      { id: '5', resourceId: 'a', start: '2018-04-18T10:10:00', end: '2018-04-18T10:40:00', title: 'event 5' }
    ]                                                                         
  };
}

最重要

1. 无需在 app.module.ts

   中添加任何模块引用

   从“ap-angular2-fullcalendar”导入{CalendarModule};     @NgModule（{       进口：[         CalendarModule，

2. 无需在component.ts中添加任何组件引用

   从'ap-angular2-fullcalendar'导入{CalendarComponent};