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

Question

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

Plunker 示例代码：按 'Datepicker in a popup.' 旁边工具栏上的向下箭头，获取来自 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}`);
}

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

How to pass date from date picker on button press (ng-bootstrap | Angular 2)

ng-bootstrap

angular