日期选择器-仅年份

Question

我正在修改一个简单的日期选择器。

我只希望有 Year （年份）下拉列表（不需要月份）。

我尝试通过添加CSS来删除“月份”下拉列表：

MyClass::AddType(bool);

不幸的是，这不仅删除了Month下拉列表，还删除了Year，请参见下文：

请参阅 STACKBLITZ

Answer 1

您可以为第一个选择添加样式

@Component({
  selector: 'ngbd-datepicker-basic',
  templateUrl: './datepicker-basic.html',
  styles:[':host ::ng-deep select:first-child{display:none;}']
})
export class NgbdDatepickerBasic {
...
}

参考：https://stackblitz.com/edit/angular-year-datepicker-ng-bootstrap-kyjfjz

Answer 2

最好使用的是ngx-bootstrap中的Datepicker。

查看此链接： https://valor-software.com/ngx-bootstrap/#/datepicker#min-mode

它有一个显示模式选项，称为“最小模式”，因此您不能超出此范围。您可以将最小模式设置为“年”。作品精美！

Answer 3

您只能使用yyyy formate一年。请尝试以下代码。

$scope.dateOptions = {
    formatYear: 'yyyy',
    startingDay: 1,
    minMode: 'year'
};

工作演示http://plnkr.co/edit/0SPMYQ6ND7AOfZwDAFB8?p=preview

Answer 4

一个简单的解决方案是使用CSS通过ngb-datepicker-navigation-select隐藏display:none中的第一个select元素

工作示例：https://stackblitz.com/edit/angular-year-datepicker-ng-bootstrap-8ag1xe