Средство выбора диапазона дат

Используемый мной фреймворк (Angular) и ngx-bootstrap 2.0.5

Я хочу создать реактивную форму и подготовить данные для отправки через API. Но у меня проблема с компонентом Data Range Picker.

Остальная модель API, кроме данных JSON, подобных этой. (Например)

{
  "firstName": "John",
  "lastName": "Baily",
  "startDate": "01/01/2018",
  "endDate": "01/06/2018"
}

Я подготовил все данные, но когда я хочу использовать диапазон выбора данных, я не могу разделить дату из массива на 2 объекта. Для примера данных из диапазона выбора данных

"range": [
    "2018-06-03T18:51:51.000Z",
    "2018-07-01T18:51:51.000Z"
  ]

И мне нужны эти данные для двух объектов, один в startDate, а другой в endDate.

Не могли бы вы помочь мне с этим?


person theserver    schedule 26.06.2018    source источник


Ответы (2)


Имея

"range"= [ "2018-06-03T18:51:51.000Z", "2018-07-01T18:51:51.000Z" ]

ты можешь просто

{ "firstName": "John", "lastName": "Baily", "startDate": range[0], "endDate": range[1] }

Idk, почему ваш API требует нестандартного формата, гарантированного ISO, но вам придется преобразовать эти даты в требуемый формат API - это относительно легко в Google, как отформатировать Date объекты

person Antoniossss    schedule 26.06.2018

Машинопись

  Form: FormGroup;

  const r1 = this.Form.get('range').value[0];
  const r2 = this.Form.get('range').value[1];

  const fromDate = new Date(r1);
  const toDate = new Date(r2);

HTML

  <form [formGroup]="Form">
    <div class="form-group">
      <input class="form-control" #drp="bsDaterangepicker" bsDaterangepicker formControlName="range">
    </div>

  </form>
person Ole    schedule 26.06.2018
comment
Спасибо за это, но я создаю конструктор форм, и в этом конструкторе форм я готовлю такие данные. this.formGroup = this.fb.group ({firstName: [''], lastName: [''], startDate: [''], endDate: ['']}); Это означает, что я импортирую новый объект в элемент управления формой. Могу ли я избежать добавления нового объекта в элемент управления формой? - person theserver; 26.06.2018
comment
Вы здесь ничего не готовите, вы только определяете свою форму. Очевидно, вы не должны использовать здесь startDate endDate, поскольку ваш виджет не поддерживает отдельные перерывы. Вы должны привязаться к чему-то вроде dates, а позже, когда вы захотите использовать данные, которые находятся в форме, трансформируйте их. Формы не предназначены для моделирования данных. - person Antoniossss; 27.06.2018