在我的角度應用程式中，我有一個下拉串列，下面有一些資料在 div 中。
組件.html
<select class="form-control" id="power" required>
<option value="" disabled selected>Select a category</option>
<option *ngFor="let category of categoryNames">{{ category }}</option>
</select>
<!--below code I have to show or hide-->
<div class="row">
<div class="col-sm-8">
<p>Slect Habits</p>
<h5 class="formxp">Slect Items</h5>
</div>
<div class="col-sm-4">
<p>Slect Habits</p>
<h5 class="formxp">Slect Items</h5>
</div>
</div>
所以我的要求是當我單擊下拉串列中的任何專案時，我必須顯示 div（在上面代碼中的下拉串列之后）
任何人都可以幫助我解決同樣的問題。
uj5u.com熱心網友回復：
您可以在元素上定義一個模板變數（例如#mySelect）<select>，然后使用它來確定選定的值：mySelect.value。
如果您需要在所選類別等于“習慣”時顯示 div，您可以嘗試以下操作：
<!-- #mySelect is declared on <select> element -->
<select class="form-control" id="power" required #mySelect>
<option value="" disabled selected>Select a category</option>
<option *ngFor="let category of categoryNames">{{ category }}</option>
</select>
<div class="row" *ngIf="mySelect.value === 'Habits'">
<div class="col-sm-8">
<p>Slect Habits</p>
<h5 class="formxp">Slect Items</h5>
</div>
<div class="col-sm-4">
<p>Slect Habits</p>
<h5 class="formxp">Slect Items</h5>
</div>
</div>
您可以在此處閱讀有關Angular 模板變數的更多資訊： https ://angular.io/guide/template-reference-variables
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/426128.html
標籤：javascript html 有角度的 打字稿 角度ng-if