feat(modules): now all modules export .forRoot() static method with p…

…roviders

.gitignore

@@ -27,8 +27,9 @@ testem.log
 /logs
 
 # e2e
-#/demo/e2e/*.js
-#/demo/e2e/*.map
+/demo/e2e/*.js
+/demo/e2e/*.map
+demo/temp
 
 #System Files
 .DS_Store

demo/src/app/app.component.ts

@@ -1,7 +1,7 @@
 import { AfterContentInit, Component, ViewContainerRef } from '@angular/core';
 import { NavigationEnd, Router } from '@angular/router';
 
-import { Ng2BootstrapConfig, Ng2BootstrapTheme, ComponentsHelper } from 'ng2-bootstrap';
+import { Ng2BootstrapConfig, Ng2BootstrapTheme } from 'ng2-bootstrap';
 
 let w:any = window;
 
@@ -17,9 +17,8 @@ export class AppComponent implements AfterContentInit {
   public isBs3:boolean = Ng2BootstrapConfig.theme === Ng2BootstrapTheme.BS3;
 
   private router:Router;
-  public constructor(router:Router, componentsHelper:ComponentsHelper, vcr:ViewContainerRef) {
+  public constructor(router:Router) {
     this.router = router;
-    componentsHelper.setRootViewContainerRef(vcr);
   }
 
   public ngAfterContentInit():any {

demo/src/app/app.module.ts

@@ -27,7 +27,6 @@ import { DemoTabsModule } from './components/tabs';
 import { DemoTimepickerModule } from './components/timepicker/index';
 import { DemoTooltipModule } from './components/tooltip/index';
 import { DemoTypeaheadModule } from './components/typeahead/index';
-import { ComponentsHelper } from 'ng2-bootstrap';
 
 @NgModule({
   declarations: [
@@ -58,7 +57,6 @@ import { ComponentsHelper } from 'ng2-bootstrap';
     DemoTooltipModule,
     DemoTypeaheadModule
   ],
-  providers: [{provide: ComponentsHelper, useClass: ComponentsHelper}],
   bootstrap: [AppComponent]
 })
 export class AppModule {

demo/src/app/common/main-menu/main-menu.component.ts

@@ -6,7 +6,7 @@ import { routes } from '../../app.routing';
 
 @Component({
   selector: 'main-menu',
-  templateUrl: 'main-menu.component.html'
+  templateUrl: './main-menu.component.html'
 })
 export class MainMenuComponent {
   public isBs3:boolean = Ng2BootstrapConfig.theme === Ng2BootstrapTheme.BS3;

demo/src/app/common/top-menu/top-menu.component.ts

@@ -4,7 +4,7 @@ import { NavigationEnd, Router } from '@angular/router';
 
 @Component({
   selector: 'top-menu',
-  templateUrl: 'top-menu.component.html'
+  templateUrl: './top-menu.component.html'
 })
 export class TopMenuComponent implements AfterViewInit {
   public isShown:boolean = false;

demo/src/app/components/accordion/index.ts

@@ -16,7 +16,7 @@ import { AccordionModule } from 'ng2-bootstrap';
     CommonModule,
     FormsModule,
     SharedModule,
-    AccordionModule
+    AccordionModule.forRoot()
   ],
   exports: [AccordionSectionComponent]
 })

demo/src/app/components/alerts/index.ts

@@ -11,7 +11,7 @@ import { AlertModule } from 'ng2-bootstrap';
     AlertsDemoComponent
   ],
   imports: [
-    AlertModule,
+    AlertModule.forRoot(),
     CommonModule,
     SharedModule
   ],

demo/src/app/components/buttons/index.ts

@@ -14,7 +14,7 @@ import { ButtonsModule } from 'ng2-bootstrap';
   imports: [
     CommonModule,
     FormsModule,
-    ButtonsModule,
+    ButtonsModule.forRoot(),
     SharedModule
   ],
   exports: [ButtonsSectionComponent]

demo/src/app/components/carousel/index.ts

@@ -15,7 +15,7 @@ import { CarouselModule } from 'ng2-bootstrap';
   imports:[
     CommonModule,
     FormsModule,
-    CarouselModule,
+    CarouselModule.forRoot(),
     SharedModule
   ],
   exports: [CarouselSectionComponent]

demo/src/app/components/collapse/index.ts

@@ -15,7 +15,7 @@ import { CollapseModule } from 'ng2-bootstrap';
     CommonModule,
     FormsModule,
     SharedModule,
-    CollapseModule
+    CollapseModule.forRoot()
   ],
   exports: [CollapseSectionComponent]
 })

demo/src/app/components/datepicker/index.ts

@@ -15,7 +15,7 @@ import { DatepickerModule } from 'ng2-bootstrap';
     CommonModule,
     FormsModule,
     SharedModule,
-    DatepickerModule
+    DatepickerModule.forRoot()
   ],
   exports: [DatepickerSectionComponent]
 })

demo/src/app/components/dropdown/index.ts

@@ -15,7 +15,7 @@ import { DropdownModule } from 'ng2-bootstrap';
     CommonModule,
     FormsModule,
     SharedModule,
-    DropdownModule
+    DropdownModule.forRoot()
   ],
   exports: [DropdownSectionComponent]
 })

demo/src/app/components/modal/index.ts

@@ -15,7 +15,7 @@ import { ModalSectionComponent } from './modal-section.component';
     CommonModule,
     FormsModule,
     SharedModule,
-    ModalModule
+    ModalModule.forRoot()
   ],
   exports: [ModalDemoComponent]
 })

demo/src/app/components/pagination/index.ts

@@ -15,7 +15,7 @@ import { PaginationModule } from 'ng2-bootstrap';
     CommonModule,
     FormsModule,
     SharedModule,
-    PaginationModule
+    PaginationModule.forRoot()
   ],
   exports: [PaginationSectionComponent]
 })

demo/src/app/components/progressbar/index.ts

@@ -15,7 +15,7 @@ import { ProgressbarModule } from 'ng2-bootstrap';
     CommonModule,
     FormsModule,
     SharedModule,
-    ProgressbarModule
+    ProgressbarModule.forRoot()
   ],
   exports: [ProgressbarSectionComponent]
 })

demo/src/app/components/rating/demos/rating-demo.component.ts

@@ -2,7 +2,7 @@ import { Component } from '@angular/core';
 
 @Component({
   selector: 'rating-demo',
-  templateUrl: 'rating-demo.component.html'
+  templateUrl: './rating-demo.component.html'
 })
 export class RatingDemoComponent {
   public x:number = 5;

demo/src/app/components/rating/index.ts

@@ -15,7 +15,7 @@ import { RatingModule } from 'ng2-bootstrap';
     CommonModule,
     FormsModule,
     SharedModule,
-    RatingModule
+    RatingModule.forRoot()
   ],
   exports: [RatingSectionComponent]
 })

demo/src/app/components/tabs/index.ts

@@ -15,7 +15,7 @@ import { TabsModule } from 'ng2-bootstrap';
     CommonModule,
     FormsModule,
     SharedModule,
-    TabsModule
+    TabsModule.forRoot()
   ],
   exports: [TabsSectionComponent]
 })

demo/src/app/components/timepicker/index.ts

@@ -15,7 +15,7 @@ import { TimepickerDemoComponent } from './demos/timepicker-demo.component';
     CommonModule,
     FormsModule,
     SharedModule,
-    TimepickerModule
+    TimepickerModule.forRoot()
   ],
   exports: [TimepickerSectionComponent]
 })

demo/src/app/components/typeahead/demos/typeahead-demo.component.ts

@@ -7,7 +7,7 @@ import { TypeaheadMatch } from 'ng2-bootstrap';
 
 @Component({
   selector: 'typeahead-demo',
-  templateUrl: 'typeahead-demo.component.html'
+  templateUrl: './typeahead-demo.component.html'
 })
 export class TypeaheadDemoComponent {
   public stateCtrl:FormControl = new FormControl();

demo/src/app/components/typeahead/index.ts

@@ -16,7 +16,7 @@ import { TypeaheadSectionComponent } from './typeahead-section.component';
     FormsModule,
     ReactiveFormsModule,
     SharedModule,
-    TypeaheadModule
+    TypeaheadModule.forRoot()
   ],
   exports: [TypeaheadSectionComponent]
 })

demo/src/app/getting-started/getting-started.component.ts

@@ -1,17 +1,16 @@
 import { Component } from '@angular/core';
 
-let desc = ``;
 let dependencies = require('html!markdown!./docs/dependencies.md');
 let installation = require('html!markdown!./docs/installation.md');
 let readingDocumentation = require('html!markdown!./docs/reading-documentation.md');
 
 @Component({
   selector: 'getting-started',
-  templateUrl: 'getting-started.template.html'
+  templateUrl: './getting-started.template.html'
 })
 export class GettingStartedComponent {
   public name:string = `Native Angular 2 directives for bootstrap`;
-  public desc:string = desc;
+  public desc:string = '';
   public dependencies:string = dependencies;
   public installation:string = installation;
   public readingDocumentation:string = readingDocumentation;

demo/src/app/shared/demo-section/demo-section.component.ts

@@ -2,7 +2,7 @@ import { Component, Input } from '@angular/core';
 
 @Component({
   selector: 'demo-section',
-  templateUrl: 'demo-section.component.html'
+  templateUrl: './demo-section.component.html'
 })
 export class DemoSectionComponent {
   @Input() public name:string;

demo/src/app/shared/shared.module.ts

@@ -4,7 +4,7 @@ import { TabsModule } from 'ng2-bootstrap';
 
 @NgModule({
   declarations: [DemoSectionComponent],
-  imports: [TabsModule],
+  imports: [TabsModule.forRoot()],
   exports: [DemoSectionComponent]
 })
 export class SharedModule {

scripts/test.ts

@@ -38,9 +38,9 @@ let context = require.context('../demo/src', true, /\.spec\.ts/);
 // And load the modules.
 context.keys().map(context);
 
-console.log(context.keys())
+console.log(context.keys());
 let context2 = require.context('../src/spec', true, /\.spec\.ts/);
 context2.keys().map(context2);
-console.log(context2.keys())
+console.log(context2.keys());
 // Finally, start Karma to run the tests.
 __karma__.start();

src/accordion/accordion.component.ts

@@ -1,8 +1,6 @@
 import { Component, HostBinding, Input } from '@angular/core';
-
 import { AccordionPanelComponent } from './accordion-group.component';
 
-// todo: support template url
 @Component({
   selector: 'accordion',
   template: `<ng-content></ng-content>`

src/accordion/accordion.module.ts

@@ -1,5 +1,5 @@
 import { CommonModule } from '@angular/common';
-import { NgModule } from '@angular/core';
+import { NgModule, ModuleWithProviders } from '@angular/core';
 
 import { CollapseModule } from '../collapse/collapse.module';
 import { AccordionPanelComponent } from './accordion-group.component';
@@ -11,4 +11,5 @@ import { AccordionComponent } from './accordion.component';
   exports: [AccordionComponent, AccordionPanelComponent]
 })
 export class AccordionModule {
+  public static forRoot(): ModuleWithProviders {return {ngModule: AccordionModule, providers: []};}
 }

src/alert/alert.module.ts

@@ -1,13 +1,16 @@
 import { CommonModule } from '@angular/common';
-import { NgModule } from '@angular/core';
+import { NgModule, ModuleWithProviders } from '@angular/core';
 import { AlertComponent } from './alert.component';
 import { AlertConfig } from './alert.config';
 
 @NgModule({
   imports: [CommonModule],
   declarations: [AlertComponent],
   exports: [AlertComponent],
-  providers: [AlertConfig]
+  entryComponents: [AlertComponent]
 })
 export class AlertModule {
+  public static forRoot(): ModuleWithProviders {
+    return {ngModule: AlertModule, providers: [AlertConfig]};
+  }
 }

src/buttons/buttons.module.ts

@@ -1,13 +1,14 @@
-import { NgModule } from '@angular/core';
-import { FormsModule } from '@angular/forms';
+import { NgModule, ModuleWithProviders } from '@angular/core';
 
 import { ButtonCheckboxDirective } from './button-checkbox.directive';
 import { ButtonRadioDirective } from './button-radio.directive';
 
 @NgModule({
-  imports: [FormsModule],
   declarations: [ButtonCheckboxDirective, ButtonRadioDirective],
-  exports: [ButtonCheckboxDirective, ButtonRadioDirective, FormsModule]
+  exports: [ButtonCheckboxDirective, ButtonRadioDirective]
 })
 export class ButtonsModule {
+  public static forRoot(): ModuleWithProviders {
+    return {ngModule: ButtonsModule, providers: []};
+  }
 }

src/carousel/carousel.module.ts

@@ -1,5 +1,5 @@
 import { CommonModule } from '@angular/common';
-import { NgModule } from '@angular/core';
+import { NgModule, ModuleWithProviders } from '@angular/core';
 
 import { CarouselComponent } from './carousel.component';
 import { SlideComponent } from './slide.component';
@@ -10,4 +10,7 @@ import { SlideComponent } from './slide.component';
   exports: [SlideComponent, CarouselComponent]
 })
 export class CarouselModule {
+  public static forRoot(): ModuleWithProviders {
+    return {ngModule: CarouselModule, providers: []};
+  }
 }

src/collapse/collapse.module.ts

@@ -1,4 +1,4 @@
-import { NgModule } from '@angular/core';
+import { NgModule, ModuleWithProviders } from '@angular/core';
 
 import { CollapseDirective } from './collapse.directive';
 
@@ -7,4 +7,7 @@ import { CollapseDirective } from './collapse.directive';
   exports: [CollapseDirective]
 })
 export class CollapseModule {
+  public static forRoot(): ModuleWithProviders {
+    return {ngModule: CollapseModule, providers: []};
+  }
 }

src/datepicker/datepicker.module.ts

@@ -1,5 +1,5 @@
 import { CommonModule } from '@angular/common';
-import { NgModule } from '@angular/core';
+import { NgModule, ModuleWithProviders } from '@angular/core';
 import { FormsModule } from '@angular/forms';
 
 import { DatePickerInnerComponent } from './datepicker-inner.component';
@@ -13,9 +13,12 @@ import { DatepickerConfig } from './datepicker.config';
   imports: [CommonModule, FormsModule],
   declarations: [DatePickerComponent, DatePickerInnerComponent, DayPickerComponent,
                  MonthPickerComponent, YearPickerComponent],
-  exports: [DatePickerComponent, DatePickerInnerComponent, DayPickerComponent, FormsModule,
+  exports: [DatePickerComponent, DatePickerInnerComponent, DayPickerComponent,
             MonthPickerComponent, YearPickerComponent],
-  providers: [DatepickerConfig]
+  entryComponents: [DatePickerComponent]
 })
 export class DatepickerModule {
+  public static forRoot(): ModuleWithProviders {
+    return {ngModule: DatepickerModule, providers: [DatepickerConfig]};
+  }
 }

src/dropdown/dropdown.module.ts

@@ -1,4 +1,4 @@
-import { NgModule } from '@angular/core';
+import { NgModule, ModuleWithProviders } from '@angular/core';
 
 import { DropdownMenuDirective } from './dropdown-menu.directive';
 import { DropdownToggleDirective } from './dropdown-toggle.directive';
@@ -9,4 +9,7 @@ import { DropdownDirective } from './dropdown.directive';
   exports: [DropdownDirective, DropdownMenuDirective, DropdownToggleDirective]
 })
 export class DropdownModule {
+  public static forRoot(): ModuleWithProviders {
+    return {ngModule: DropdownModule, providers: []};
+  }
 }