如何让值提供程序以角度读取更新的值

Question

我有一个人们登录的应用程序。在他们的个人资料中，他们可以选择自己的输入和输出日期格式。为了适应这种情况，我做了一个自定义的日期选择器组件。在@componet装饰器内部的值提供程序中，我使用了一个MY_FORMATS变量，该变量告诉 matdatePicker 如何格式化日期。解析日期输入和显示日期输入来自我的应用程序内的环境变量。

问题是当应用程序初始化并使用环境变量中的默认日期时，@component命中。用户登录后，将使用用户数据更新环境变量中的日期格式。但@component从不查看更新的数据。

我该怎么做才能解决这个问题？此外，用户有可能在登录时更改他们选择的日期格式，我也需要组件来注册该更改。但我似乎无法让@component装饰器中的值提供者再次查看日期格式变量。

谢谢你的帮助。如果您决定回答这个问题，请给出详细的解释。我是编码新手，模糊的东西可能对我无济于事。

export let MY_FORMATS = {
parse: {
dateInput: env.inDateFormat.toUpperCase(),
},
display: {
dateInput: env.outDateFormat.toUpperCase(),
monthYearLabel: 'MMM YYYY',
dateA11yLabel: 'DD MMM YYYY',
monthYearA11yLabel: 'MMMM YYYY',
},
};
@Component({
selector: 'custom-datepicker',
templateUrl: './custom-datepicker.component.html',
styleUrls: ['./custom-datepicker.component.scss'],
providers: [
{ provide: DateAdapter, useClass: MomentDateAdapter, deps: [MAT_DATE_LOCALE] },
{ provide: MAT_DATE_FORMATS, useValue: MY_FORMATS },
{
provide: NG_VALUE_ACCESSOR,
multi: true,
useExisting: forwardRef(() => CustomDatepickerComponent),
}
]
})

Answer 1

我找到了一个堆栈闪电战，我可以编辑并使用它来解决我的问题。它需要将格式放在可注入的服务中，而不是将其保留在值提供程序中。我仍然希望有人能给我一种使用上述方法的方法。但这是堆栈闪电战的链接，它能够帮助我解决这个问题。https://stackblitz.com/edit/date-picker-format-change?file=src%2Fapp%2Fapp.module.ts