如何在没有表单名称的情况下清除AngularJS中的表单

时间:2016-03-25 05:54:21

标签: javascript angularjs forms angularjs-scope

我想在Angular中使用$ setPristine()和$ setUntouched()函数来清除表单字段。但是,它们似乎只适用于具有名称的表单。如果我的表单没有名称且只有简单的提交功能怎么办?

我在这里阅读了文档:https://docs.angularjs.org/api/ng/type/form.FormController

这不起作用:

    $scope.submit = function() {

        // blah blah

        // Resets the form fields to blank
        // I could simply do
        // $scope.field1 = '';
        // $scope.field2 = '';
        // But I want it to look cleaner

        This.$setPristine();
        This.$setUntouched();

    };

2 个答案:

答案 0 :(得分:2)

Angular将仅为命名表单创建FormController的实例,因为表单名称用作表示范围内该特定表单的FormController实例的属性。没有任何名称,它就无法将FormController实例与范围上的任何属性名称相关联。

例如,给定以下标记

<div ng-controller="MyController">

    <form name="myForm" id="myForm" ng-submit="handleSubmit()">
      /* Some Markup */
    </form>

</div>

在MyController中,$scope有一个名为myForm的属性,代表FormController个实例,您可以调用方法或访问如下所示的属性。

$scope.myForm.$valid
$scope.myForm.$setPristine();
$scope.myForm.$setUntouched();

调用setPristine()setUntouched()只会将表单状态从dirty更改为pristineuntouched,这可以从添加到表单中的类中看出来,但是不重置表单字段。 FormController上没有公开方法来重置表单字段和相应的模型值,但只需对使用{{1}绑定值的方式稍作修改即可实现此目的。 }。在模型中使用点(。)是一种很好的做法,因为它可以捕获单个对象中的所有表单状态,还可以防止您创建阴影属性。

在您的HTML中,

ng-model

在你的控制器中,

<input type="text" id="fullName" name="fullname" ng-model="data.fullName"/>
<input type="email" id="email" name="email" ng-model="data.email" /> 

这里有一个样本Pen。希望这会有所帮助:)

答案 1 :(得分:0)

使用“this”而不是“This”

尝试:

$scope.currentRecord={};