【问题标题】:AngularJS: reset function resets the table but not clears input field and select?AngularJS:重置功能重置表格但不清除输入字段并选择?
【发布时间】:2014-11-21 05:32:22
【问题描述】:
<form novalidate class="simple-form">
    <label ng-hide="tab==1">Reviews Min: <input type="number" ng-init="revNum=30" class="form-control review-input" min="0" step="10" ng-model="revNum" /></label>
    <label>Min Price &#163;: <input type="number" ng-init="minNum=0" class="form-control price-input" min="0" step="1000" ng-model="minNum" /></label>
    <label>Max Price &#163;: <input type="number" ng-init="maxNum=0" class="form-control price-input" min="0" step="1000" ng-model="maxNum" /></label>
    <label><select ng-model="currentCarType"  style="display:block;" ng-options="key for key in carTypeObj">
        <option value="">Select Type</option>
    </select></label>
    <label><button class="btn btn-primary " style="display:block;" ng-click="updateNumArray(revNum, minNum, maxNum); updateType(currentCarType)">Filter</button></label>
    <label><button class="btn btn-primary " style="display:block;" ng-click="resetNumArray(); resetType()">reset</button></label>
</form>

这是我的控制器:

carApp.controller("TableBodyCtrl", function($scope, $http){
    $scope.revNum = 30;
    $scope.minNum = 0;
    $scope.maxNum = 0;
    $scope.currentCarType = null;

    $scope.resetType = function(){
        $scope.currentCarType = null;
    }

    $scope.resetNumArray = function(){
        $scope.revNum = 30;
        $scope.minNum = 0;
        $scope.maxNum = 0;
    }

当我单击reset 按钮时,我的表会更新,所以currentCarTypenullrevNum30minNum0maxNum0。但是我的input 字段以及我的select 没有更新。我该如何解决?

【问题讨论】:

  • 嗨,你能试试这个 $scope.currentCarType = '';而不是在 resetType 函数中为 null
  • 问题确实是因为角度模型中的点问题。

标签: javascript html angularjs select input


【解决方案1】:

我猜你可能会爱上这里讨论的问题: Why don't the AngularJS docs use a dot in the model directive?

输入的模型在父作用域上初始化,但一旦您在那里编辑,值就会存储在子作用域中,随后也会从那里读取。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2018-06-13
    • 1970-01-01
    • 1970-01-01
    • 2018-11-30
    • 1970-01-01
    • 1970-01-01
    • 2021-09-10
    • 1970-01-01
    相关资源
    最近更新 更多