即使在选择一个值后,下拉菜单仍然禁用
Dropdown is still disable even after selecting a value
有两个下拉按钮 d1 和 d2。 d2 被禁用。从 'd1' 中选择一个值后,'d2' 仍然被禁用。
<div class="card-container">
<label>Country</label>
<select placeholder="Country" [(ngModel)]="selectedCountry" (change)="changeCountry($event)" >
<option>--Choose Country--</option>
<option *ngFor="let country of Countries" >{{country.name}}</option>
</select>
</div>
<div class="card-container">
<label>State</label>
<select placeholder="State" (change)="changeState($event)"
[disabled]="selectedCountry">
<option>--Choose State--</option>
<option *ngFor="let state of states">{{state.name}}</option>
</select>
</div>
使用 [disabled]="selectedCountry" d2 被禁用,但如果 [disabled]="!selectedCountry" 则不禁用
我想让 d2 只有在选择 d1 时才可选择。
[disabled]="selectedCountry"
表示如果您有一些 selectedCountry
的值,它将是 true
,这意味着它已禁用。所以条件应该是相反的
[disabled]="!selectedCountry"
如果 selectedCountry
没有任何值, 将禁用它。
<div class="card-container">
<label>Country</label>
<select placeholder="Country" [(ngModel)]="selectedCountry" (change)="changeCountry($event)" >
<option>--Choose Country--</option>
<option *ngFor="let country of Countries" >{{country.name}}</option>
</select>
</div>
<div class="card-container">
<label>State</label>
<select placeholder="State" (change)="changeState($event)" [disabled]="!selectedCountry">
<option>--Choose State--</option>
<option *ngFor="let state of states">{{state.name}}</option>
</select>
</div>
还要确保 selectedCountry
的初始值为 selectedCountry = ''
有两个下拉按钮 d1 和 d2。 d2 被禁用。从 'd1' 中选择一个值后,'d2' 仍然被禁用。
<div class="card-container">
<label>Country</label>
<select placeholder="Country" [(ngModel)]="selectedCountry" (change)="changeCountry($event)" >
<option>--Choose Country--</option>
<option *ngFor="let country of Countries" >{{country.name}}</option>
</select>
</div>
<div class="card-container">
<label>State</label>
<select placeholder="State" (change)="changeState($event)"
[disabled]="selectedCountry">
<option>--Choose State--</option>
<option *ngFor="let state of states">{{state.name}}</option>
</select>
</div>
使用 [disabled]="selectedCountry" d2 被禁用,但如果 [disabled]="!selectedCountry" 则不禁用 我想让 d2 只有在选择 d1 时才可选择。
[disabled]="selectedCountry"
表示如果您有一些 selectedCountry
的值,它将是 true
,这意味着它已禁用。所以条件应该是相反的
[disabled]="!selectedCountry"
如果 selectedCountry
没有任何值,将禁用它。
<div class="card-container">
<label>Country</label>
<select placeholder="Country" [(ngModel)]="selectedCountry" (change)="changeCountry($event)" >
<option>--Choose Country--</option>
<option *ngFor="let country of Countries" >{{country.name}}</option>
</select>
</div>
<div class="card-container">
<label>State</label>
<select placeholder="State" (change)="changeState($event)" [disabled]="!selectedCountry">
<option>--Choose State--</option>
<option *ngFor="let state of states">{{state.name}}</option>
</select>
</div>
还要确保 selectedCountry
的初始值为 selectedCountry = ''