これは非常に日常的な作業のようですが、元の状態に戻すことはできません。私はドロップダウンから各値のngスイッチを使用しています。私はこれを研究して、私は私の問題に関する文書を見つけることができないようです。同様の質問がありましたが、私は角度APIを見てきましたが、私の問題を解決するものはありません。angular:ドロップダウン時にng-switchをリセットする
HTML:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
</head>
<body ng-app = ""> <!--using the body to initialize the application-->
<p>Survey Form</p>
<form name="form1" method="post" action="">
<fieldset>
<p>
<label>Email:
<input type="text" name="cust_email" id="cust_email">
</label>
</p>
<p>Please rate the following times from best (1) to worst (4)</p>
<div ng-app = "myForm" ngController = "formControl">
<p>
<select id="option1" ng-hide = "time1" ng-model = "time1" value = "option1">
<option value="1">1. Best time</option>
<option value="2">2. Next Best time</option>
<option value="3">3. Not as good</option>
<option value="4">4. Worst time</option>
</select>
Monday/Wednesday 10:10am-Noon
</p>
<div ng-switch = "time1" name = "switch1"><!--time1 module is reserved for Monday/Wednesday 10:10am-Noon dropdown-->
<div ng-switch-when = "1"><!--when value 1 from the dropdown is selected-->
<h3>This time is the: Best Time.</h3><hr><!--display this-->
</div>
</div>
<div ng-switch = "time1">
<div ng-switch-when = "2">
<h3>This time is the: Next Best Time.</h3><hr>
</div>
</div>
<div ng-switch = "time1">
<div ng-switch-when = "3">
<h3>This time is the: Not as good.</h3><hr>
</div>
</div>
<div ng-switch = "time1">
<div ng-switch-when = "4">
<h3>This time is the: Worst Time.</h3><hr>
</div>
</div>
<p>
<input type="submit" name="button" id="button" value="Submit">
<input type="reset" name="button2" id="button2" value="Reset" ng-click = "reset()">
</p>
</div>
angular:
<script>
angular.module('myForm', []).controller('formControl', function ($scope){
$scope.reset = function(){
$scope.form1 = {};
};
});
</script>
</fieldset>
</form>
<p> </p>
</body>
</html>
ドロップダウンから値が選択されるたびに、ng-switchがアクティブになります。これによりテキストが配置され、ドロップダウンが削除されます。リセットすると、ドロップダウンが再表示され、ng-switchテキストが消えます。基本的にすべてを元の状態にリセットします。
質問を投稿するのは少し不安です。いつでも私は投票して叱ってしまうからです。私はこの質問が十分に具体的であることを願っています。
この質問は、ちょうど(jsfiddle plnkrまたはcodepenへの理想的なリンクを手助けしたい人のためのそれが容易になります)あなたはここで行ったように、最小限の再生を含めるようにしてください良いです。あまりにも個人的には、あまりにも多くの研究や努力をしている不明な質問や質問に不満を感じる私のようなボランティアだけではなく、 – shaunhusain
@shaunhusain、ありがとうございました。私はちょっと良く感じる:) –