ngx-datepicker 标头为空

Question

我正在尝试使用 ngx-datepicker 但无论我做什么都会使标题（datepicker 导航部分）为空。

预期结果：

当前结果：

我的日期选择器组件代码：

• 模板代码：

  <ngb-datepicker #dp [(ngModel)]="model" (navigate)="date = $event.next"></ngb-datepicker>

• 组件.ts

  import { Component, OnInit } from '@angular/core';
  import {NgbCalendar, NgbDateStruct} from '@ng-bootstrap/ng-bootstrap';
  
  @Component({
    selector: 'app-date-picker',
    templateUrl: './date-picker.component.html',
    styleUrls: ['./date-picker.component.scss']
  })
  export class DatePickerComponent implements OnInit {
  
    model: NgbDateStruct;
    date: {year: number, month: number};
  
    constructor(private calendar: NgbCalendar) {
    }
  
    ngOnInit(): void {
    }
  }
  

• 依赖关系：

    "@angular/animations": "~11.1.2",
    "@angular/common": "~11.1.2",
    "@angular/compiler": "~11.1.2",
    "@angular/core": "~11.1.2",
    "@angular/forms": "~11.1.2",
    "@angular/platform-browser": "~11.1.2",
    "@angular/platform-browser-dynamic": "~11.1.2",
    "@angular/localize": "11.0.9",
    "@angular/router": "~11.1.2",
    "@ng-bootstrap/ng-bootstrap": "^9.1.0",
    "@ngx-translate/core": "^13.0.0",
    "@ngx-translate/http-loader": "^6.0.0",
    "bootstrap-with-rtl": "^1.0.3",
    "ngx-pagination": "^5.0.0",
    "ngx-select-ex": "^6.0.2",
    "ngx-webstorage": "^7.0.1",
    "bootstrap": "^4.5.3",
    "rxjs": "~6.6.0",
    "tslib": "^2.0.0",
    "zone.js": "~0.11.3"
  

编辑：
这是该问题的最小重现：
https://stackblitz.com/edit/angular-ivy-w83mcv?file=src/app/app.component.ts

Answer 1

运行后解决了

npm install @angular/localize

然后将

import '@angular/localize/init';

添加到 polyfills.ts

Answer 2

对于 Angular 17，我使用了 npm add @angular/localize 并添加了 import '@angular/localize/init';到我使用 ngbdatepicker 的组件。