0

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

问题是当应用程序初始化并使用我的环境变量中的默认日期时，@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),
    }
  ]
})
4

1 回答 1

0

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

于 2020-06-23T03:06:08.930 回答