从 C# API 到 Angular for ngx-bootstrap DateTimePicker 获取日期

Question

为了使用Angular的ngx-bootstrap datepicker日历的禁用日期我有一个C# 上的控制器

public List<DateTime> DisabledDays(int carId)
{
    var disabledDates = new List<DateTime>();
    var result = GetAll();
    var startResult = _rentalDal.GetAll().Where(x => x.CarId == carId).Select(x => x.RentDate).ToList();
    var endResult = _rentalDal.GetAll().Where(x => x.CarId == carId).Select(x => x.ReturnDate).ToList();

    for (int i = 0; i < result.Data.Count; i++)
    {
        //for (var disDate = startResult[i]; disDate <= endResult[i]; disDate = DateTime.Parse(disDate.AddDays(1).ToString("dd/MM/yyyy")))
        for (var disDate = startResult[i]; disDate <= endResult[i]; disDate = disDate.AddDays(1))
        {
            disabledDates.Add(DateTime.Parse(disDate.ToString("dd/MM/yyyy")));
            //disabledDates.Add(Convert.ToDateTime(disDate)).ToString("MM-dd-yyyy");
            //disabledDatesString.Add(dt.(ToString("d MMM YY")));
        }
    }

    return disabledDates;
}

它工作正常，但格式应该像 YYYY-MM-DD 我尝试了一些但无法为需要的 Angular 输出。我的输出是

    "2021-01-01T00:00:00",
    "2021-01-02T00:00:00",
    "2021-01-03T00:00:00",
    "2021-01-04T00:00:00",
    "2021-01-05T00:00:00",
    "2021-01-06T00:00:00",
    "2021-01-07T00:00:00",
    "2021-01-08T00:00:00",
    "2021-01-09T00:00:00",
    "2021-01-10T00:00:00",

angulars 方法在我手动输入时有效，但当我尝试使用函数获取它时，它会像上面那样接收数据。

    disabledDates: Date[];
    
    this.disabledDates = [
          new Date('2021-03-20'),
          new Date('2021-03-10'),
          new Date('2021-03-11'),
        ];

getDisabledDates(carId:number){
   this.rentalService.getDisabledDates(carId).subscribe(response=>{
    this.disabledDates= response
     console.log(response)
   })

有没有办法让我的日期格式像 YYYY-MM-DD 像 disabledDates 手动提要一样？第二个是通过 for 或 for each 循环添加的新日期

Answer 1

既然你的startResult和endResult变量是List<DateTime>那么修改后的方法肯定适合你。

因此，您不需要 List<string> 作为方法的 return 类型而不是 List<DateTime>。

因为在您的 JSON 响应中 DateTime 和 string 都将是 string。

解法：

public List<string> DisabledDays(int carId)
{
    var disabledDates = new List<string>();
    var result = GetAll();
    var startResult = _rentalDal.GetAll().Where(x => x.CarId == carId).Select(x => x.RentDate).ToList();
    var endResult = _rentalDal.GetAll().Where(x => x.CarId == carId).Select(x => x.ReturnDate).ToList();

    for (int i = 0; i < result.Data.Count; i++)
    {
        for (var disDate = startResult[i]; disDate <= endResult[i]; disDate = disDate.AddDays(1))
        {
            disabledDates.Add(disDate.ToString("yyyy-MM-dd"));
        }
    }

    return disabledDates;
}

Answer 2

我喜欢转换日期的服务。在 this SO 中将日期从字符串转换为 ngbDate，与在日期对象中转换相同 - 假设您的属性是“date”

getData(key:any)
{
     this.get(...).pipe(map((response)=>{
        response.date=new Date(response.date)
        return response;
     }
     ))
}
getList(key:any)
{
     this.get(...).pipe(map((response:any[])=>{
        response.forEach(x=>{
         x.date=new Date(x.date)
        })
        return response;
     }
     ))
}
updateData(data2)
{
    //see that in this case you make a copy of the object
    const data={...data2,date:data2.date.getFullYear()+"-"+
                  ('00'+(data2.date.getMonth()+1).slice(-2)+'-'+
                  ('00'+date.getDate()).slice(-2)
               }
    this.http.post(....,data)
}

因此，在您的组件中，您始终使用日期对象

从 C# API 到 Angular for ngx-bootstrap DateTimePicker 获取日期

Get Dates from C# API to Angular for ngx-bootstrap DateTimePicker

c#

ngx-bootstrap

angular