我有两个下拉菜单,它们是单击Retrieve
按钮时调用的函数的参数。我想发生的是当两个下拉菜单都没有选择数据时,Retrieve
按钮被禁用。如果两个下拉列表都有数据,那么我希望按钮能够正常运行。这是我当前的html:
<div class="dropdown">
<div class="input-group">
<h4 class="sessionText">Session: </h4>
<select [(ngModel)]='sessionReportFilter.sessionName'
class="custom-select form-control-sm"
(change)='sessionDataChange($event)'
id="inputGroupSelect01">
<option [value]="null">Select session...</option>
<option *ngFor="let session of sessionData" [value]='session.sessionName'>
{{session.sessionName}}
</option>
</select>
</div>
<div class="input-group">
<h4 class="reportText">Report Date: </h4>
<select [(ngModel)]='sessionReportFilter.fileName' *ngIf='currentSession' class="custom-select form-control-sm" id="inputGroupSelect01">
<option [value]="null">Select report...</option>
<option *ngFor="let report of currentSession.reportFiles"
[value]="report">
{{report}}
</option>
</select>
<select *ngIf="currentSession === null" class="custom-select form-control-sm" id="inputGroupSelect01"></select>
</div>
<div>
<button type="button" class="btn btn-primary" disabled="disabled">Retrieve</button>
<button type="button" class="btn btn-primary" (click)="orderExceptionReportData()">Retrieve</button>
</div>
</div>
如何获得所需的结果?
[disabled]="!sessionReportFilter.fileName && sessionReportFilter.sessionName"
[当两个dropwon都没有值时,替换为要禁用的功能的位置,
so
<button type="button" class="btn btn-primary" disabled="disabled">Retrieve</button>
将是
<button type="button" class="btn btn-primary" [disabled]="!sessionReportFilter.fileName && !sessionReportFilter.sessionName">Retrieve</button>