* ng如果条件尚未得到评估

Question

下面的HTML代码具有日期输入字段和引导程序类列表组的无序列表。基于日期输入html字段的模板变量，我需要加载无序列表。但是，ul总是被渲染/显示。我在下面的代码中缺少什么？

<div style="float:left;">
                <input
                  #queryInvoiceDate
                  (change)="filterInvoiceSingleDate(queryInvoiceDate.valueAsDate)"
                  type="date"
                  class="form-control"
                  style="width:100%"
                  placeholder="Enter date:" >
              </div>
              <br><br>
              <!-- <p *ngIf="queryInvoiceDate"><strong>{{filteredTotalRevenue | currency:'USD'}}</strong></p> -->
              <ul *ngIf="queryInvoiceDate" class="list-group">
                  <li class="list-group-item">Service fee deducted: {{filteredServiceAmountTotal | number:'1.1-2' | currency:'USD'}}</li>
                  <li class="list-group-item">Revenue made by Venue: {{filteredVenueRevenueTotal | number:'1.1-2' | currency:'USD'}}</li>
                  <li class="list-group-item">Total Revenue: {{filteredTotalRevenue | number:'1.1-2' | currency:'USD'}}</li>
              </ul>

Answer 1

我会在filterInvoiceSingleDate中放入一些内容，例如dateSelected = true，并在ngIf中使用它

html：

<ul *ngIf="dateSelected" class="list-group">

ts：

dateSelected=false
filterInvoiceSingleDate(){
this.dateSelected=true
//your code
}