0

我正在尝试创建一个可重用的指令，该指令将使用$setPristine()方法简单地将我的表单及其子控件重置为原始状态，如果在用户先前与它们交互并将它们标记为脏后所有表单的输入控件都被清空。

因此，基本上该指令将监视所有表单<input>元素，如果它确定所有元素都是空的，则调用$setPristine()将所有内容重置为一格。

这似乎有点微不足道，我可以在 5 分钟内用 jQuery 搞定，但我只是用 Angular 弄湿了我的脚，我已经在这个问题上磕磕绊绊了几个小时，努力寻找最好的方法，所以任何帮助或指导不胜感激！

4

2 回答 2

2

编辑，更简单的答案：在表单元素上使用requireor属性，如果出现错误则保留表单。ng-require$pristine

如果不需要 require：

注意 - 您需要 $setPristine() 的 Angular 版本 1.1.x。

假设ng-model表单中的所有 ' 都是同一个对象的属性，您可以$watch在对象中循环遍历属性以查看它们是否为undefined空''字符串，以及$setPristine()是否为空字符串。

表单 HTML - 所有模型都是input对象的属性：

<form name="form">
  <input type="text" name="one" ng-model="input.one">
  <input type="text" name="two" ng-model="input.two"><br/>
  <input type="submit" ng-disabled="form.$pristine">
</form>

在控制器或指令中， $watch 模型的变化，然后循环遍历对象，查看所有属性是否为undefinedor ''。scope（如果在链接函数中使用，您通常会使用$scope.

var setPristine = function(input){
    if (input === undefined || input === ''){
        return 0;
    }
    return 1;
}

$scope.$watch('input', function(i){
    var flag = 0;
    //loop through the model properties
    for (var obj in i){
        flag +=setPristine(i[obj]);
    }
    // if nothing in the model object, setPristine()
    if(flag===0){
        $scope.form.$setPristine();
    }
}, true)// true allows $watch of object properties, with some overhead
于 2013-07-10T06:10:55.200 回答
0

使用表单的脏/原始状态来了解用户是否触摸过它们，并使用 ng-pattern 来了解该字段是否为空或不使用/.+/. 然后你可以检查 myForm.$dirty 和 myForm.$error.pattern ，瞧！

于 2014-03-07T12:34:00.217 回答