Угловая сова Date Time Picker Ярлыки и кнопки не локализованы

Question

В окне выбора даты совы метки От и До, а также кнопки «Установить» и «Отмена» не локализованы. Мой код для указания локали:

constructor(
  private dateTimeAdapter: DateTimeAdapter<any>
) {
    dateTimeAdapter.setLocale(localStorage.getItem('localeId'));
}

Пробовал с de, fr, zh

"ng-pick-datetime ":" ^ 7.0.0 "

В чем может быть проблема?

Редактировать:

Чтобы проверить, я попытался:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { SampleTableComponent } from './sample-table/sample-table.component';
import { MaterialModule } from './material.module';
import { MatFormComponent } from './mat-form/mat-form.component';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { OwlDateTimeModule, OwlNativeDateTimeModule, OwlDateTimeIntl } from 'ng-pick-datetime';

export class DefaultIntl extends OwlDateTimeIntl {
  cancelBtnLabel: 'C';
  setBtnLabel: 'S';
  rangeFromLabel: 'F';
  rangeToLabel: 'T';
}

@NgModule({
  declarations: [
    AppComponent,
    SampleTableComponent,
    MatFormComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    FormsModule,
    ReactiveFormsModule,
    BrowserAnimationsModule,
    MaterialModule,
    OwlDateTimeModule,
    OwlNativeDateTimeModule,
  ],
  providers: [{provide: OwlDateTimeIntl, useClass: DefaultIntl}],
  bootstrap: [AppComponent]
})
export class AppModule { }

Но я все еще вижу От, До, Установить, Отмена

Answer 1

Локализация для разных языков и форматов определяется OWL_DATE_TIME_LOCALE и OWL_DATE_TIME_FORMATS. Вот официальный документ .

Установка языкового стандарта:

По умолчанию токен инъекции OWL_DATE_TIME_LOCALE будет использовать существующий код языкового стандарта LOCALE_ID из @ angular / core. Если вы хотите переопределить его, вы можете указать новое значение для токена OWL_DATE_TIME_LOCALE:

import { NgModule } from '@angular/core';
import { OWL_DATE_TIME_LOCALE } from 'ng-pick-datetime';

@NgModule({
  providers: [
    // use french locale
    {provide: OWL_DATE_TIME_LOCALE, useValue: 'fr'},
  ],
})
export class AppExampleModule {
}

Также можно установить языковой стандарт во время выполнения с помощью метода setLocale () объекта DateTimeAdapter.

import { Component } from '@angular/core';
import { DateTimeAdapter } from 'ng-pick-datetime';

@Component({
  selector: 'app-example',
  templateUrl: 'app-example.html',
})
export class AppExample {
    constructor(dateTimeAdapter: DateTimeAdapter<any>) {
        dateAdapter.setLocale('ja-JP'); // change locale to Japanese
    }
}

В этих примерах используются французский и японский - в вашем случае это будет zh

В вашем случае метки и сообщения кажутся не локализованными - попробуйте следующее и отрегулируйте строки так, чтобываши потребности (я верю в китайский, но, пожалуйста, поправьте меня, если я ошибаюсь):

import { NgModule } from '@angular/core';
import { OwlDateTimeModule, OwlNativeDateTimeModule, OwlDateTimeIntl} from 'ng-pick-datetime';

// here is the default text string - just adjust the strings to reflect your preferred language
export class DefaultIntl extends OwlDateTimeIntl = {
    /** A label for the up second button (used by screen readers).  */
    upSecondLabel= 'Add a second',

    /** A label for the down second button (used by screen readers).  */
    downSecondLabel= 'Minus a second',

    /** A label for the up minute button (used by screen readers).  */
    upMinuteLabel= 'Add a minute',

    /** A label for the down minute button (used by screen readers).  */
    downMinuteLabel= 'Minus a minute',

    /** A label for the up hour button (used by screen readers).  */
    upHourLabel= 'Add a hour',

    /** A label for the down hour button (used by screen readers).  */
    downHourLabel= 'Minus a hour',

    /** A label for the previous month button (used by screen readers). */
    prevMonthLabel= 'Previous month',

    /** A label for the next month button (used by screen readers). */
    nextMonthLabel= 'Next month',

    /** A label for the previous year button (used by screen readers). */
    prevYearLabel= 'Previous year',

    /** A label for the next year button (used by screen readers). */
    nextYearLabel= 'Next year',

    /** A label for the previous multi-year button (used by screen readers). */
    prevMultiYearLabel= 'Previous 21 years',

    /** A label for the next multi-year button (used by screen readers). */
    nextMultiYearLabel= 'Next 21 years',

    /** A label for the 'switch to month view' button (used by screen readers). */
    switchToMonthViewLabel= 'Change to month view',

    /** A label for the 'switch to year view' button (used by screen readers). */
    switchToMultiYearViewLabel= 'Choose month and year',

    /** A label for the cancel button */
    cancelBtnLabel= 'Cancel',

    /** A label for the set button */
    setBtnLabel= 'Set',

    /** A label for the range 'from' in picker info */
    rangeFromLabel= 'From',

    /** A label for the range 'to' in picker info */
    rangeToLabel= 'To',

    /** A label for the hour12 button (AM) */
    hour12AMLabel= 'AM',

    /** A label for the hour12 button (PM) */
    hour12PMLabel= 'PM',
};

@NgModule({
    imports: [OwlDateTimeModule, OwlNativeDateTimeModule],
    providers: [
        {provide: OwlDateTimeIntl, useClass: DefaultIntl},
    ],
})
export class AppExampleModule {
}

Источник: Official-docs