根據選擇的更改顯示/隱藏文本

Question

使用AngularJS，需要顯示具有選定值的下拉列表：

- 當用戶選擇不同的值時，我們應該顯示警告消息，不應繼續更新（保存按鈕禁用）。
- 當用戶將恢復爲原始值，消息應該隱藏，並能更新（保存按鈕啓用）

<select ng-model="vm.sldetails.AgencyGroupID" onchange="" 
     ng-options="a.AgencyGroupID as a.AgencyGroupName for a in vm.agencygroups"> 
    <option value="">--Select--</option> 
</select> 
<label ng-show="">Warning message</label> 

與其說在控制器的事件，我們可以直接在OnChange事件實現？

Answer 1

<div class="col-md-2"> 
    <select class="form-control" ng-model="vm.sldetails.AgencyGroupID"       
     ng-options="a.AgencyGroupID as a.AgencyGroupName for a in vm.agencygroups"> 
      <option value="">--Select--</option> 
    </select>    
</div> 

HTML：

<label class="col-md-2 control-label text-align-left" id="lblWarningMessage" ng-if="vm.sldetails.AgencyGroupID==='your value'">Warning message</label> 

在標籤標記，你的價值應該由烏爾替代比較值

Answer 2

我想你可以嘗試這樣的事：

<select ng-model="vm.sldetails.AgencyGroupID" ng-change="vm.selectChanged()" 
     ng-options="a.AgencyGroupID as a.AgencyGroupName for a in vm.agencygroups"> 
    <option value="">--Select--</option> 
</select> 
<label ng-show="vm.showWarning">Warning message</label> 

而且在js中：

vm.selectChanged = function(){ 
    if(vm.sldetails.AgencyGroupID !== 'the initial value'){ 
     vm.showWarning = true; 
    }else{ 
     vm.showWarning = false; 
    } 
}