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

基于onchange的选择显示/隐藏文本

2 个答案: