Question

这与我的previous帖子有关空角度值有关。

我试图理解为什么我的应用程序/代码在当前情况下会表现出不同的行为。

  calculateAge(dateOne: Date, dateTwo: Date): number {
    let firstDate = new Date(dateOne);
    let secondDate = new Date(dateTwo);
    let differenceInDates = Math.abs(firstDate.getTime() - secondDate.getTime());
    let age = Math.floor(differenceInDates / (1000 * 3600 * 24));
    console.log(age);
    return age;
  }

  getFlowers() {
    this.flowerSubscription = this.flowerService.getFlowersByFlowerId(this.flowerId, this.someName).subscribe(
      res => {
        this.dataToSend = res.DataToSend
        this.flowerSubscription = this.flowerService.getFlowers(this.dataToSend, this.someName).subscribe(
          res => {
            this.flower = res; // this.Flower is interface IFlower
            console.log(this.flower); <--- this is null
            if (this.flower !== undefined) {
              this.flowerNumber = (this.flower.FNumber || '--').toString();
              this.flowerInDate = this.flower.FlowerInDate;
              this.flowerOutDate = this.flower.FlowerInDate;
              this.flowerAge = this.calculateAge(this.flower.flowerWarehouseDate, this.flower.flowerStoreDate);
              this.flowerStatus = (this.flower.FlowerStatus || '--');
              this.customerAmount = (this.flower.CustomerAmount || '--').toString();
              this.warehouseAmount = (this.flower.WarehouseAmount || '--').toString();
            }
        }
    }
}

HTML

  <table id="FlowerDetails" class="f-fs">
    <tr>
      <td class="f-title">Flower Nmber</td>
      <td class="f-text">{{flowerNumber}}</td>
    </tr>
    <tr>
      <td class="f-title">flowerInDate</td>
      <td class="f-text">{{(flowerInDate != null) ? (claimStartDate | date: 'shortDate') : '--'}}</td>
    </tr>
    <tr>
      <td class="f-title">flowerOutDate</td>
      <td class="f-text">{{(flowerOutDate != null) ? (flowerOutDate | date: 'shortDate') : '--'}}</td>
    </tr>
    <tr>
      <td class="f-title">Age</td>
      <td class="f-text">{{flowerAge}}</td>
    </tr>
    <tr>
      <td class="f-title">Flower Status</td>
      <td class="f-text">{{flowerStatus}}</td>
    </tr>
  </table>

在控制台上打印时，

this.flower为空。如果数据为空，我将空值设置为--。但是，控制台仍显示为空，并且--未按预期显示。我正在使用API调用从后端获取数据。我不明白为什么在相同的情况下代码的行为会有所不同。

Answer 1

妈妈

getFlowers() {
    this.flowerSubscription = this.flowerService.getFlowersByFlowerId(this.flowerId, this.someName).subscribe(
      res => {
        this.dataToSend = res.DataToSend
        this.flowerSubscription = this.flowerService.getFlowers(this.dataToSend, this.someName).subscribe(
          res => {
            this.flower = res; // this.Flower is interface IFlower
            console.log(this.flower); <--- this is null
            if (this.flower){ //if this.flower <> undefined and <>null
              this.flowerNumber = (this.flower.FNumber || '--').toString();
              this.flowerInDate = this.flower.FlowerInDate;
              this.flowerOutDate = this.flower.FlowerInDate;
              this.flowerAge = this.calculateAge(this.flower.flowerWarehouseDate, this.flower.flowerStoreDate);
              this.flowerStatus = (this.flower.FlowerStatus || '--');
              this.customerAmount = (this.flower.CustomerAmount || '--').toString();
              this.warehouseAmount = (this.flower.WarehouseAmount || '--').toString();
            }
            else
            {
              this.flowerNumber = '--';
              this.flowerInDate = '--';
              this.flowerOutDate = '--';
              this.flowerAge = 0;
              this.flowerStatus = '--';
              this.customerAmount = '--';
              this.warehouseAmount = '--';
            }
        }
    }

Answer 2

我通过检查this.dataToSend是否为空找到了解决方案。如果它为null，则将所有值都设置为--，否则，将值设置为实际变量。 @Eliseo，谢谢您的帮助。

如何在角度中设置空值

2 个答案: