Как передать только дату из angular 6 в web api

#c# #angular #angular6

Вопрос:

Я передаю дату из своего приложения angular 6 в веб-api. Проблема заключается в том, когда я выбираю, например, 10 марта 2019 года из datepicker. Когда я получаю это в веб-api, он преобразует это в 6:30 вечера 9 марта, я думаю, что это связано с часовым поясом, но мне не нужно время, я просто хочу передать дату.

Ниже приведен угловой код

   getBookingList() {

    this.bookingListSubscription = this.restService.getBookingListForGrid(this.booking).subscribe(
  data => {
    setTimeout(() => {
      if (data.status = '200') { 
      this.bookingList = data;
      this.bookingList.forEach((element) => {
        element.StartDate =  this.datePipe.transform(element.StartDate, "dd/MM/yyyy"),
          element.EndDate = new Date(element.EndDate);
      });
    }, 3000)
  });
  }

И я сохраняю дату в формате DateTime в c #.

1. Какой ожидаемый формат в конце WebAPI? т.е. yyyy-MM-dd ?

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

3. В этом случае вам необходимо указать часовой пояс. Если вы введете новую дату (yourDate) в серверной части, она преобразует дату в соответствии с часовым поясом сервера. Пожалуйста, предоставьте какой-нибудь фрагмент серверного кода!

4. без времени…?

5. Да, без времени

Ответ №1:

Вы можете использовать angular DatePipe :

Импортируйте это:

 import { DatePipe } from '@angular/common';

и в конструкторе:

 constructor(private datePipe: DatePipe){}

а чтобы изменить формат выбранной даты, вы можете просто использовать метод transform:

 this.datePipe.transform(this.date, "your_expected_date_format"); // Format: dd/MM/yyyy OR dd-MM-yyyy OR yyyy-MM-dd

TS-код:

 import {Component} from '@angular/core';
import {FormControl} from '@angular/forms';


import { DatePipe } from '@angular/common';

/** @title Select with multiple selection */
@Component({
  selector: 'select-multiple-example',
  templateUrl: 'select-multiple-example.html',
  styleUrls: ['select-multiple-example.css'],
   providers: [
    DatePipe
  ]
})
export class SelectMultipleExample {

  date : any;
  formatedDate : any;

  constructor(private datePipe: DatePipe){}

  onSubmit(){
   this.formatedDate =  this.datePipe.transform(this.date, "dd/MM/yyyy");
  }
}

Stackblitz

1. тип ошибки ‘string’ не может быть присвоен типу ‘Date’

2. элемент. StartDate = this.DatePipe.transform(элемент. Дата начала, «дд/ММ/гггг»),

3. Я хочу, чтобы она имела тип Date, а не string, который может быть передан в web api и может быть сохранен в DateTime типа c#

4. измените его на type any C # примет это

5. изменил ее на любую, отмеченную в c #, все еще получая ту же дату результата — 5: 30 часов в c#

Ответ №2:

Альтернативным решением использования DatePipe было бы использование formatDate. Я передал следующие значения: дата, формат времени и locale в качестве его параметров.

В вашем component.ts вы можете сделать что-то вроде этого:

 import { formatDate } from '@angular/common';

export class AppComponent  {
  locale: string = 'en-US';
  format: string = 'dd-mm-yyyy'
  date: Date = new Date();

  constructor() {}

  transformDate(date) {
    console.log(formatDate(this.date, this.format, this.locale));
    return formatDate(this.date, this.format, this.locale);
  }
}

Я воспроизвел демо, чтобы продемонстрировать использование.

Ответ №3:

У меня была такая же проблема, я потратил много времени на исправление.Вместо отправки в виде типа datetime я отправил в серверную часть в виде строки. Начиная с конечной точки Rest API, автоматически преобразуется во время даты.

 model.dateOfBirth = new Date(moment(model.dateOfBirth).format('MM/DD/YYYY')).toDateString();

Это решило мою проблему.