根据选择的更改显示/隐藏文本

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; 
    } 
}