0

I found a couple of articles in SO about this plugin with NG4, but it seems to work at some part for me, I just can't get the value from the selection.

I followed the installation instructions, and I'm able to pull up the date picker just fine, but I can't capture the date selected. It's using ngModel, which I labeled as "myDate," but this is coming up as undefined.

The Github is not very informative, at least to me, in terms of how to get this to work, or if I need to import anything to the component.

I tried looking through the source files and the installed files in my package, but no light bulb going off.

I tried the recommended ng2-timepicker, but that just fails to install completely. Here's what I got...

import { NKDatetimeModule } from 'ng2-datetime.module';

imports: [
    BrowserModule,
    RouterModule.forRoot(appRoutes),
    ChartsModule,
    HttpModule,
    FormsModule,
    AngularFireModule.initializeApp(firebaseConfig),
    AngularFireAuthModule,
    AngularFireDatabaseModule,
    NgDatepickerModule
  ],

report.component.html: I tried putting a click event on the calendar itself and on a separate button. Still gives me undefined.

<div class="datepicker-container">
  <ng-datepicker [(ngModel)]="myDate.selection" (click)="getgDate()"></ng-datepicker>
</div>
<button class="btn btn-default" (click)="getgDate()">filter</button>

report.component.html: nothing imported (yet) for the date picker, but this always comes up undefined. I tried myDate: Date, myDate:any =[] thinking that it was treated as an array. Both are none. I console logged as this.myDate alone, and it came up empty.

myDate:any =[]

  getgDate(){
    console.log(this.myDate["selection"]);
  }

Here's my package.json in case you need it:

"dependencies": {
    "@angular/animations": "^4.2.4",
    "@angular/common": "^4.2.4",
    "@angular/compiler": "^4.2.4",
    "@angular/core": "^4.2.4",
    "@angular/forms": "^4.2.4",
    "@angular/http": "^4.2.4",
    "@angular/platform-browser": "^4.2.4",
    "@angular/platform-browser-dynamic": "^4.2.4",
    "@angular/router": "^4.2.4",
    "angular-2-data-table": "^0.1.2",
    "angular2-flash-messages": "^1.0.8",
    "angularfire2": "^4.0.0-rc.2",
    "chart.js": "^2.7.0",
    "core-js": "^2.4.1",
    "firebase": "^4.3.1",
    "ng2-charts": "^1.6.0",
    "ng2-datepicker": "^2.0.3",
    "rxjs": "^5.4.2",
    "zone.js": "^0.8.14"
Groovdafied
  • 45
  • 1
  • 1
  • 8
  • Please give your post a title which describes your problem, rather than just vaguely describing the problem area. –  Sep 26 '17 at 16:56
  • Okay, I figured it out. I needed to add a name to the date picker tab. – Groovdafied Sep 27 '17 at 16:23

0 Answers0