search

angulardart / angular_components

The official Material Design components for AngularDart. Used at Google in production apps.
https://pub.dev/packages/angular_components
372 stars 123 forks source link

material-input date format #432

Closed EugenNekrasov closed 5 years ago

EugenNekrasov commented 5 years ago

Problem

material-input with dateParsing directive doesn't respect specified date format.

Example

import 'package:angular/angular.dart';
import 'package:angular_components/angular_components.dart';

@Component(
  selector: 'datepicker',
  template: '''
    <material-input
      dateParsing
      [dateFormat]="dateFormat"
      [date]="today"
    ></material-input>
  ''',
  directives: [
    materialInputDirectives,
    DateInputDirective,
  ],
)
class TestDatepickerComponent {
  Date today = Date.today();
  final DateFormat dateFormat = DateFormat('dd.MM.yyyy');
}

Result

image There is inner exception during initialization:

Error: FormatException: Trying to read MMM from 21.08.2019 at position 0
    at Object.dart.throw (dart_sdk.js:4604)
    at intl._DateFormatPatternField.new.throwFormatException (date_format_field.dart:87)
    at intl._DateFormatPatternField.new.parseField (date_format_field.dart:337)
    at intl._DateFormatPatternField.new.parse (date_format_field.dart:250)
    at date_format.dart:347
    at Array.[dartx.forEach] (dart_sdk.js:7800)
    at intl.DateFormat.yMMMd.[_parse] (date_format.dart:347)
    at intl.DateFormat.yMMMd.parseLoose (date_format.dart:310)
    at Function.parseLoose (date.dart:73)
    at date_input.dart:209
    at Array.[dartx.any] (dart_sdk.js:8023)
    at material_datepicker__date_input.DateInputDirective.new.[_parseDateUsingFormatList] (date_input.dart:207)
    at material_datepicker__date_input.DateInputDirective.new.[_parseDate] (date_input.dart:260)
    at date_input.dart:181
    at stack_zone_specification.dart:129
    at src__stack_zone_specification.StackZoneSpecification.new.[_run] (stack_zone_specification.dart:209)
    at stack_zone_specification.dart:129
    at ng_zone.dart:144
    at async._rootRunUnary (dart_sdk.js:28735)
    at async._ZoneDelegate.new.runUnary (dart_sdk.js:28355)
    at src__core__zone__ng_zone.NgZone.new.[_runUnary] (ng_zone.dart:141)
    at async._CustomZone.new.runUnary (dart_sdk.js:28562)
    at async._CustomZone.new.runUnaryGuarded (dart_sdk.js:28481)
    at _BroadcastSubscription.new.[_sendData] (dart_sdk.js:23310)
    at _BroadcastSubscription.new.[_add] (dart_sdk.js:23257)
    at _SyncBroadcastStreamController.new.[_sendData] (dart_sdk.js:23944)
    at _SyncBroadcastStreamController.new.add (dart_sdk.js:23753)
    at material_input__material_input.MaterialInputComponent.new.inputChange (base_material_input.dart:422)
    at material_datepicker__date_input.DateInputDirective.new.set date [as date] (date_input.dart:132)
    at admin__components__test_datepicker_component__datepicker_component$46template.ViewTestDatepickerComponent0.new.detectChangesInternal (datepicker_component.template.dart:114)
    at admin__components__test_datepicker_component__datepicker_component$46template.ViewTestDatepickerComponent0.new.detectChanges (app_view.dart:384)
    at admin__components__test_datepicker_component__datepicker_component$46template._ViewTestDatepickerComponentHost0.new.detectChangesInternal (datepicker_component.template.dart:166)
    at admin__components__test_datepicker_component__datepicker_component$46template._ViewTestDatepickerComponentHost0.new.detectChanges (app_view.dart:384)
    at router_outlet_directive.dart:123
    at LinkedMap.new.putIfAbsent (dart_sdk.js:16804)
    at src__directives__router_outlet_directive.RouterOutlet.new.prepare (router_outlet_directive.dart:119)
    at src__router__router_impl.RouterImpl.new._resolveStateForOutlet$ (router_impl.dart:282)
    at _resolveStateForOutlet$.next (<anonymous>)
    at onValue (dart_sdk.js:22714)
    at stack_zone_specification.dart:129
    at src__stack_zone_specification.StackZoneSpecification.new.[_run] (stack_zone_specification.dart:209)
    at stack_zone_specification.dart:129
    at ng_zone.dart:144
    at async._rootRunUnary (dart_sdk.js:28735)
    at async._ZoneDelegate.new.runUnary (dart_sdk.js:28355)
    at src__core__zone__ng_zone.NgZone.new.[_runUnary] (ng_zone.dart:141)
    at async._CustomZone.new.runUnary (dart_sdk.js:28562)
    at _FutureListener.then.handleValue (dart_sdk.js:24640)
    at handleValueCallback (dart_sdk.js:25105)
    at Function._propagateToListeners (dart_sdk.js:25137)
    at dart_sdk.js:24890
    at safeMicrotask (ng_zone.dart:117)
    at src__stack_zone_specification.StackZoneSpecification.new.[_run] (stack_zone_specification.dart:209)
    at stack_zone_specification.dart:119
    at ng_zone.dart:132
    at async._rootRun (dart_sdk.js:28729)
    at async._ZoneDelegate.new.run (dart_sdk.js:28349)
    at src__core__zone__ng_zone.NgZone.new.[_run] (ng_zone.dart:129)
    at async._CustomZone.new.run (dart_sdk.js:28555)
    at async._CustomZone.new.runGuarded (dart_sdk.js:28472)
    at async._AsyncCallbackEntry.new.callback (dart_sdk.js:28511)
    at Object.async._microtaskLoop (dart_sdk.js:25352)
    at async._startMicrotaskLoop (dart_sdk.js:25358)
    at dart_sdk.js:25433

Suggestion

In the component's code add parsing with _dateFormat field besides hard-coded formats.

EugenNekrasov commented 5 years ago

I has too old version of the library.