Question

如果数据库中没有可用数据，我正在尝试显示一个图像。这里我有一些变量的JSON数据，这些变量已绑定到仪表板，在没有捕获数据的情况下我试图显示NO DATA IMAGE

<div class="column mt-4">
  <h4>{{projects.InActive}}</h4>
  <!-- <h6><strong>Inactive Users</strong></h6> -->
  <p class="card-text text-center">Inactive Users</p>
  <div id="rcorners1" class="progress">
    <div class="progress-bar progress-bar-success" *ngIf="" role="progressbar" aria-valuenow="70" aria-valuemin="0"
      aria-valuemax="100" [style.width.%]="projects.InActive">
      <span class="sr-only">70% Complete</span>
    </div>
  </div>
</div>

{"response":{"_isSucceed":true,"_data":{"Projects":{"Active":37,"InActive":6,"Total":43},"Issues":{"Active":18,"InActive":6,"Total":24},"Users":{"Active":7,"InActive":1,"Total":8}}}}

Answer 1

您需要使用var isSucceed，在其中将其分配为默认值false，然后分配response._isSucceed的值

<div class="column mt-4">  
      <div *ngIf="!isSucceed"> <img src="your image path" /> </div>
      <div *ngIf="isSucceed">
          <h4>{{projects.InActive}}</h4>
          <!-- <h6><strong>Inactive Users</strong></h6> -->
          <p class="card-text text-center">Inactive Users</p>
          <div id="rcorners1" class="progress">
            <div class="progress-bar progress-bar-success" *ngIf="" role="progressbar" aria-valuenow="70" aria-valuemin="0"
              aria-valuemax="100" [style.width.%]="projects.InActive">
              <span class="sr-only">70% Complete</span>
            </div>
          </div>
        </div>
    <div>

如果仪表板中没有数据，则显示图像的条件

1 个答案: