Question

亲爱的，我做了一个javascript函数：选中了复选框以启用某些控制器，而未选中则禁用相同的控制器并清除其数据，仅在第一次单击时效果良好，这意味着如果我选中了该复选框并选择了数据，然后取消选中该复选框，它将清除输入框中的数据并隐藏datetimepicker。但是如果第二次选中该复选框并选择数据，则取消选中该复选框，它不会清除数据，但会隐藏时间选择器。

HTML

 <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 margin-bottom-10 padding-none">
                                <div class="col-lg-3 col-md-3 col-sm-3 col-xs-12">
                                    <div class="form-group">
                                        <div class="form-check margin-top-30">
                                            <label>
                                                <input ng-model="attend" type="checkbox" name="check" ng-change="checkattendance()"> <span class="label-text">Attendance Time</span>
                                            </label>
                                        </div>
                                    </div>
                                </div>

                                <div class="col-lg-3 col-md-3 col-sm-3 col-xs-12">
                                    <div class="form-group">
                                        <div class="col-xs-12">
                                            <label class="control-label" for="name">Operator<span class="danger">*</span></label>
                                        </div>
                                        <div class="col-xs-12">
                                            <select ng-disabled="!attend" ng-show="lang==0" class="form-control input-sm" ng-model="opinname" ng-options="o.opid as o.openm for o in Operator"></select>
                                            <select ng-disabled="!attend" ng-show="lang==1" class="form-control input-sm" ng-model="opinname" ng-options="o.opid as o.opanm for o in Operator"></select>
                                        </div>
                                    </div>
                                </div>

                                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-6">
                                    <div class="form-group">
                                        <div class="col-xs-12">
                                            <label class="control-label" for="name">From <span class="danger">*</span></label>
                                        </div>
                                        <div class="col-xs-12 date">
                                            <div id="timeform1" class="input-append date">
                                                <input data-format="hh:mm:ss" type="text" class="form-control" ng-disabled="!attend" ng-model="from2">
                                                <span class="add-on" >
                                                    <i data-time-icon="icon-time"id="icon1" data-date-icon="icon-calendar" ng-show="attend">
                                                    </i>
                                                </span>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-6">
                                    <div class="form-group">
                                        <div class="col-xs-12">
                                            <label class="control-label" for="name">To <span class="danger">*</span></label>
                                        </div>
                                        <div class="col-xs-12 date">
                                            <div id="timeto1" class="input-append date">
                                                <input data-format="hh:mm:ss" type="text" class="form-control" ng-disabled="!attend" ng-model="to2">
                                                <span class="add-on">
                                                    <i data-time-icon="icon-time" data-date-icon="icon-calendar" ng-show="attend">
                                                    </i>
                                                </span>
                                            </div>
                                        </div>
                                    </div>
                                </div>

Angular js

$scope.checkattendance = function () {
        if ($scope.attend == true) {

            $('#timeform1').datetimepicker({
                pickTime: true, pickDate: false
            });
            $('#timeto1').datetimepicker({
                pickTime: true, pickDate: false
            });
        }
        else  {
            $scope.opinname = '';
            $scope.from2 = '';
            $scope.to2 = '';
            $scope.apply();

        }

    }

为什么未绑定ng-model = from2和ng-model = to2并清除数据任何帮助，在此先感谢

Answer 1

一个问题是您当前的checkattendance函数没有更改出席布尔值，因此每次更改复选框时都需要将状态从true切换为false或从false切换为true，一种简单的修改是修改功能并添加{ {1}}在函数的开头或结尾。如下所示：

$scope.attend =!$scope.attend;

您还应该将复选框的选定状态绑定到该布尔值，例如$scope.checkattendance = function () { $scope.attend =!$scope.attend; if ($scope.attend == true) { $('#timeform1').datetimepicker({ pickTime: true, pickDate: false }); $('#timeto1').datetimepicker({ pickTime: true, pickDate: false }); } else { $scope.opinname = ''; $scope.from2 = ''; $scope.to2 = ''; $scope.apply(); } }

第二次单击Angularjs时未清除某些输入框

1 个答案: