如何重置angularjs中的输入字段和复选框

我有一个单输入和另外两个复选框标记为是和号码我想保存输入值，当我点击是[这不是问题]。点击是后，输入和复选框应该重置。我怎样才能做到这一点？将ng-model设置为null不适用于我。如何重置angularjs中的输入字段和复选框

var app = angular.module("app", ['ionic']); 
 

 
app.controller("MainCtrl", function ($scope,$timeout,$state) { 
 

 
\t \t $scope.selected='other'; 
 
    $scope.refresh = function(selected,answer){ 
 
    if(selected == 'yes'){ 
 
     $timeout(function(){ 
 
     $scope.$apply(function(){ 
 
      $scope.uncheck = false; 
 
     }) 
 
      
 
      },250); 
 
    } 
 
     
 
    } 
 
});

<html> 
 

 
<head> 
 
    <link rel="stylesheet" href="http://code.ionicframework.com/1.3.2/css/ionic.css" /> 
 
    <script src="http://code.ionicframework.com/1.3.2/js/ionic.bundle.min.js"></script> 
 
</head> 
 

 
<body> 
 
    <div class="bar bar-header bar-assertive"> 
 
     <h1 class="title">Example</h1> 
 
     </div> 
 
    <div ng-app="app" style="margin-top:64px;padding:20px;"> 
 
    
 
    <div ng-controller="MainCtrl" class="has-header"> 
 
     
 
     <label class="item item-input"> 
 
\t \t  <textarea msd-elastic ng-model="answer.three" placeholder="Your answer"></textarea> 
 
\t \t </label> 
 
     <div> 
 
     <ion-checkbox class="cs-checkbox" ng-model="selected" ng-true-value="'no'" ng-change="statethree(selected,answer)">No</ion-checkbox> 
 
     <ion-checkbox class="cs-checkbox" ng-disabled="!answer.three" ng-checked="uncheck" ng-model="selected" ng-true-value="'yes'" ng-change="refresh(selected,answer)">Yes</ion-checkbox> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</body> 
 

 
</html>

来源

2017-02-12 Suraj Khanal

下面是工作代码复选框，但通常在这样的情况下，最好能够使用单选按钮（但它chnage你的UI设计）

var app = angular.module("app", ['ionic']); 
 

 
app.controller("MainCtrl", function ($scope,$timeout,$state) { 
 

 
    $scope.selected='other'; 
 
    $scope.refresh = function(selected,answer){ 
 
    if($scope.selected){ 
 
     $timeout(function() { 
 
     $scope.answer.three = ''; 
 
     $scope.selected = ''; 
 
     }, 250) 
 
    }; 
 
     
 
    } 
 
});

<html> 
 

 
<head> 
 
    <link rel="stylesheet" href="http://code.ionicframework.com/1.3.2/css/ionic.css" /> 
 
    <script src="http://code.ionicframework.com/1.3.2/js/ionic.bundle.min.js"></script> 
 
</head> 
 

 
<body> 
 
    <div class="bar bar-header bar-assertive"> 
 
     <h1 class="title">Example</h1> 
 
     </div> 
 
    <div ng-app="app" style="margin-top:64px;padding:20px;"> 
 
    
 
    <div ng-controller="MainCtrl" class="has-header"> 
 
     
 
     <label class="item item-input"> 
 
\t \t <textarea msd-elastic ng-model="answer.three" placeholder="Your answer"></textarea> 
 
\t \t </label> 
 
     <div> 
 
     <ion-checkbox class="cs-checkbox" ng-true-value="false" ng-model="selected">No</ion-checkbox> 
 
     <ion-checkbox class="cs-checkbox" ng-disabled="!answer.three" ng-model="selected" ng-change="refresh(selected,answer)">Yes</ion-checkbox> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</body> 
 

 
</html>

另请注意，您不应该使用由于$timeout已经触发了角度摘要循环，因此在$timeout内部回调了。

来源

2017-02-12 11:47:44

非常感谢您的解决方案。 –

如何重置angularjs中的输入字段和复选框

回答

相关问题