Jhipster项目中的组件集成有什么特别之处吗?

时间:2017-10-31 11:08:20

标签: angular jhipster angular-components

我正在尝试将FullCalendar组件集成到我的Jhipster项目中,但它不起作用。 是否有以下链接中指定的步骤:https://www.npmjs.com/package/ap-angular2-fullcalendar。 我的页面显示但不是我的日历。当我做F12时,不会显示错误。所以我不知道该怎么做才能理解我的错误在哪里。

我认为我的错误在于我的组件集成。 Jhispter项目中的组件集成有什么特别之处吗?

PS:我还尝试将FullCalendar组件集成到一个全新的非Jhipster项目中并且我工作了。因此,只有在Jhipster项目中才会导致一些问题。

PS:对不起我的英语。

app.module.ts:

enter code here
//all imports are here ...
//IMPORTS FOR MY CALENDAR
import {CalendarComponent} from "ap-angular2-fullcalendar";
import { MonCalendrierComponent } from './monCalendrier/monCalendrier.component';

import {
    JhiMainComponent,
    LayoutRoutingModule,
    NavbarComponent,
    FooterComponent,
    ProfileService,
    PageRibbonComponent,
    ActiveMenuDirective,
    ErrorComponent
} from './layouts';

@NgModule({
    imports: [
        BrowserModule,
        LayoutRoutingModule,
        Ng2Webstorage.forRoot({ prefix: 'jhi', separator: '-'}),
        ProgestoSharedModule,
        ProgestoHomeModule,
        ProgestoAdminModule,
        ProgestoAccountModule,
        ProgestoEntityModule
        // jhipster-needle-angular-add-module JHipster will add new module here
    ],
    declarations: [
        JhiMainComponent,
        NavbarComponent,
        ErrorComponent,
        PageRibbonComponent,
        ActiveMenuDirective,
        FooterComponent,
        CalendarComponent,
        MonCalendrierComponent,
        ComposantTestComponent
    ],
    providers: [
        ProfileService,
        customHttpProvider(),
        PaginationConfig,
        UserRouteAccessService
    ],
    bootstrap: [ JhiMainComponent ]
})
export class ProgestoAppModule {}

monCalendrier.component.ts:

import { Component } from '@angular/core';

@Component({
  selector: 'jhi-mon-calendrier',
  templateUrl: 'monCalendrier.component.html'
})
export class MonCalendrierComponent {

  calendarOptions:Object = {
        //height: 'parent',tohHeroButto
        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-09OCEANEDM-13'
          },
          {
            title: 'Meeting',
            start: '2016-09-12T10:30:00',
            end: '2016-09-12T12:30:00'
          },<jhi-mon-calendrier></jhi-mon-calendrier>
          {
            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() {
        console.log("AA BB");    
    }

}

home.component.html:

<jhi-mon-calendrier></jhi-mon-calendrier>

1 个答案:

答案 0 :(得分:0)

我认为您需要在模块中导入日历,如下所示:

       Name                        Command               State                     Ports                  
------------------------------------------------------------------------------------------------------------
laradock_apache2_1        /opt/docker/bin/entrypoint ...   Up       0.0.0.0:443->443/tcp, 0.0.0.0:80->80/tcp
laradock_applications_1   /true                            Exit 0                                           
laradock_mysql_1          docker-entrypoint.sh mysqld      Up       0.0.0.0:3306->3306/tcp                  
laradock_php-fpm_1        docker-php-entrypoint php-fpm    Up       9000/tcp                                
laradock_phpmyadmin_1     /run.sh phpmyadmin               Up       0.0.0.0:8080->80/tcp                    
laradock_workspace_1      /sbin/my_init                    Up       0.0.0.0:2222->22/tcp