如何使用 Angular.js 将下拉值设置为空白答案

【问题标题】：How to set drop down value as blank using Angular.js如何使用 Angular.js 将下拉值设置为空白
【发布时间】：2016-03-25 13:31:13
【问题描述】：

我需要一个帮助。我需要在使用 Angular.js 完成一项操作后将下拉值设置为空白。我在下面解释我的代码。

<div style="height:270px; overflow-x:hidden; overflow-y:scroll;" ng-show="viewOrderTable">
<div class="table-responsive dashboard-demo-table">
<select class="form-control"  id="status" ng-model="order_status" ng-change="changeOrderStatus(order_id,shipping_email,p.pro_data_id,order_status,p.days)">
 <option value="">Select Status</option>
                                                        <option value="In-progress">IN-PROGRESS</option>
 <option value="Dispatch">DISPATCH</option>
 <option value="Delivered">DELIVERED</option>
<option value="canceled" ng-if="p.pro_status =='Ordered' && p.pro_status=='In-progress'">CANCELED</option>
 <option value="Returned" ng-if="p.days <= 48 && p.pro_status=='Delivered'">RETURN</option>
 </select>
</div>
</div>

当用户选择DISPATCH时，从上面的列表中打开下面的表单。

<div class="" ng-show="viewDispatch">
<div style="padding-bottom:20px;">
<div class="col-md-6">
                            <div class="input-group bmargindiv1 col-md-12">
                            <span class="input-group-addon ndrftextwidth" style="width:120px; text-align:left;">Dispatched Date& Time :</span>
                            <div class="datepicker" date-format="dd-MM-y h:mm:ss" button-prev='<i class="fa fa-arrow-circle-left"></i>' button-next='<i class="fa fa-arrow-circle-right"></i>'> 
                                <input type="text" name="dispatch_date" class="form-control" id="dispatch_date" ng-model="dispatch_date" placeholder="Add Dispatched Date& Time" ng-change="clearField('dispatch_date');" />
                                </div>
                            </div>
                        </div>
                        <div class="clear"></div>
                    </div>
                    <div class="col-md-12 text-right">
                        <button type="button" class="btn btn-success" ng-click="addDispatchData();">Submit</button> <button type="button" class="btn btn-danger" ng-click="clearDispatchData();">Back</button>
                    </div>
</div>
</div>

此操作的控制器端代码如下。

$scope.changeOrderStatus=function(orderid,email,prodataid,order_status,hour){
    if(order_status=='Dispatch'){
                $scope.viewOrderTable=false;
                $scope.viewDispatch=true;
                pro_dataId=prodataid;
                order_Id=orderid;
                dStatus=order_status;
                email=email;
            }
}

当用户单击后退按钮时，它再次回到原来的状态，但下拉DISPATCH 选项显示我需要再次重置下拉列表的位置。

$scope.clearDispatchData=function(){
        $scope.viewOrderTable=true;
        $scope.viewDispatch=false;
        $scope.order_status='';
    }

我确实喜欢上面但它没有重置。请帮我解决这个问题。

【问题讨论】：

标签： javascript angularjs

【解决方案1】：

您可以在 html 文件中为此使用 ng-init

<select class="form-control"  id="status" ng-model="order_status" ng-change="changeOrderStatus(order_id,shipping_email,p.pro_data_id,order_status,p.days)" ng-init='order_status == 0'>

【讨论】：

【解决方案2】：

可能是摘要问题，您可以尝试使用$timeout，因此您应该在使用前在控制器中注入$timeout。

$scope.clearDispatchData=function(){
     $timeout(function() {
          $scope.viewOrderTable=true;
          $scope.viewDispatch=false;
          $scope.order_status='';
     });  
}

【讨论】：