如何在按钮按下时从日期选择器传递日期（ng-bootstrap | Angular 2）

Question

我正在为 Angular 2 使用 ngbDatepicker，并且想将选定的日期传递给我的 getData() 方法，我只是提醒（日期）。我无法对示例代码进行逆向工程并使其工作。

Plunker 示例代码：按“弹出窗口中的日期选择器”旁边工具栏上的向下箭头。来自 ng-bootstrap 团队的原始示例代码。

https://ng-bootstrap.github.io/#/components/datepicker

在我的组件中，我添加了一个方法，我想将选定的日期放入其中。

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

@Component({
  selector: 'ngbd-datepicker-popup',
  templateUrl: './datepicker-popup.html'
})

export class NgbdDatepickerPopup {

  model;

  getData() {
    alert('How do I get the selected date here?');
  }
}

Answer 1

从文档和 plunker 来看，您不需要传递任何东西。当您在模板中双向绑定模型时

<ngb-datepicker #dp [(ngModel)]="model"></ngb-datepicker>

日期选择器会自动更新组件中的模型。这就是[(ngModel)] 的工作原理。所以当你点击时，只需从模型中获取数据

model: NgbDateStruct;

getData() {
  alert(`${this.model.day}-${this.model.month}-${this.model.year}`);
}