Угловой Материал Datepicker | Ленивая загрузка + CustomDateAdapter + Интернационализация - RangeError: Превышен максимальный размер стека вызовов - PullRequest
0 голосов
/ 09 мая 2019

Структурный вопрос

Я не совсем уверен, нашел ли я правильное место для этих 2 строк кода:

providers: [
    { provide: MAT_DATE_LOCALE, useValue: 'de-DE' },
    { provide: DateAdapter, useClass: CustomDateAdapter, deps: [MAT_DATE_LOCALE, Platform] }
  ]

В настоящее время они находятся в моем файле material.module =>, которыйимпортируется в shared.module =>, который импортируется в app.module и каждый лениво загруженный модуль.

CustomDateAdapter:

@Injectable()
export class CustomDateAdapter extends NativeDateAdapter {
    subscription: any;

    format(date: Date, displayFormat?: string | Object): string {
        if (!this.subscription) {
            this.subscription = appLocale.subscribe(v => {
                this.setLocale(v);
            })
        }
        return super.format(date, displayFormat);
    }
}

appLocal в моей службе перевода:

export const appLocale: BehaviorSubject<string> = new BehaviorSubject('de');

(я обнаружил, что этот код работает здесь: Blitz )

Моя ситуация - у меня есть средство выбора даты, и я могу переключать язык между тремя языками без перезагрузки сайта.

Моя проблема - у меня есть глобальный сервис для перевода - так что, как показано выше, я не могу изменить язык в компоненте, потому что это раскрывающийся список в app.component.Когда я импортирую материал в app.module и в ленивый загруженный модуль (где находится указатель даты), это не может работать, потому что у меня было два экземпляра CustomDateAdapter и я просто изменил один app.component.(Надеюсь, я правильно понял все, что связано с импортом / экспортом / провайдерами ..)

Мне кажется, я исправил это с помощью BehaviorSubject и подписки ... но правильно ли это сделать?Я просто хочу зарегистрировать двух провайдеров один раз по всему миру.

Ошибка Вопрос

Извините за длинный вопрос структуры, так как он работает.К сожалению, я получаю эту ошибку.

osp-error-handler.ts:12 RangeError: Maximum call stack size exceeded
    at BehaviorSubject.push../node_modules/rxjs/internal/Observable.js.Observable._trySubscribe (Observable.js:51)
    at BehaviorSubject.push../node_modules/rxjs/internal/Subject.js.Subject._trySubscribe (Subject.js:102)
    at BehaviorSubject.push../node_modules/rxjs/internal/Observable.js.Observable.subscribe (Observable.js:30)
    at CustomDateAdapter.push../src/app/shared/plugins/material/mat-datepicker.ts.CustomDateAdapter.format (mat-datepicker.ts:40)
    at MatDatepickerInput.push../node_modules/@angular/material/esm5/datepicker.es5.js.MatDatepickerInput._formatValue (datepicker.es5.js:3259)
    at MatDatepickerInput.set [as value] (datepicker.es5.js:2961)
    at SafeSubscriber._next (datepicker.es5.js:2900)
    at SafeSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.__tryOrUnsub (Subscriber.js:196)
    at SafeSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.next (Subscriber.js:134)
    at Subscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber._next (Subscriber.js:77)

Ошибка возникает только при первом открытии страницы со средствами выбора даты.Когда я меняю дату или меняю маршрут, это больше не происходит.Я думаю, что-то не так с:

 return super.format(date, displayFormat);

Я надеюсь, что кто-то может помочь:)

Редактировать 1 - исправлена ​​ошибка:

Изменена функция форматирования на:

    format(date: Date, displayFormat?: string | Object): string {
        let loc = appLocale.getValue();
        if (this.locale !== loc)
            this.setLocale(loc);
        return super.format(date, displayFormat);
    }

Благодаря Сергею, который направил меня в правильном направлении.Если вы подпишетесь на BehaviorSubject, вы получите много вызовов изменений (даже если это одно и то же значение - точно не знаю, почему).Так как он не работает без if, если я думаю, что если вы вызываете setLocale, функция func вызывается снова из-за триггера изменения внутри - так что вы никогда не выйдете из этого ..

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...