Angular ：仅当 Select 第一个日期时才显示第二个日期字段

我有两个日期文件:

<f或m
  action=""
  class="flex flex-col gap- p-5 items-center justify-center mt-[10rem]"
>
  <div name="step1" class="flex flex-col gap-5 p-5 items-center justify-center">
    <label f或="" class="text-5xl font-bold drop-shadow-md typewriter">
      <h1 class="">When do we start?</h1>
    </label>

    <p-calendar
      #date
      name="date"
      [(ngModel)]="flightSelectionService.startingDate"
      styleClass="my-inputswitch"
    ></p-calendar>
  </div>
  @if(flightSelectionService.startingDate !== flightSelectionService.endingDate
  ){
  <div
    name="step2 "
    class="flex flex-col gap-5 p-5 items-center justify-center"
  >
    <label f或="" class="text-5xl font-bold drop-shadow-md typewriter">
      <h1 class="">When do we come back?</h1>
    </label>
    <p-calendar
      #date
      name="date"
      [(ngModel)]="flightSelectionService.endingDate"
      styleClass="my-inputswitch"
    ></p-calendar>
  </div>
  }
</f或m>
<p>selected startingDate is {{ flightSelectionService.startingDate }}</p>
<p>selected endingDate is {{ flightSelectionService.endingDate }}</p>

以及一项服务:

imp或t { Injectable } from '@angular/c或e';

@Injectable({
  providedIn: 'root',
})
exp或t class FlightSelectionService {
  startingCity: string = '';
  selectedEndingCity: string = '';
  startingDate: Date = new Date();
  endingDate: Date = new Date();
  construct或() {}
}

我想显示 Select 第二次日期的可能性:

 <div   name="step2 "

仅当用户 Select 此分区中的第一个日期时

      <div name="step1"

由于对象是日期类型并且它们是初始化的，因此它们的值与now相同，所以我try 了这个比较来在加载页面时隐藏第二个迪夫:

  @if(flightSelectionService.startingDate !== flightSelectionService.endingDate

但它不起作用. 我也不能这样写

flightSelectionService.startingDate === ''

或

flightSelectionService.startingDate === numm

既然他们是约会.如何解决？