【问题标题】:Dynamically reset ng-form in Angular在 Angular 中动态重置 ng-form
【发布时间】:2015-11-12 08:13:37
【问题描述】:

我查看了以下内容:Reset Form in AngularJSAngular clear subform data and reset validation 从这些我正在尝试创建一个动态表单重置/清除函数,看起来如下所示:

$scope.clearSection = function(formName){

    $scope.formName.$setPristine();
    $scope.formName.$setUntouched();
};

是否可以在表单名称动态传递给该函数的角度创建像这样的动态清除函数?

【问题讨论】:

    标签: javascript angularjs


    【解决方案1】:

    示例 plunkr:http://plnkr.co/edit/lnGym0vKsANL6oks30RG

    $scope.resetForm = function(formName) {
      var form = $scope[formName];
      form.$setUntouched();
      form.$setPristine();
    }
    

    注意:您仍然需要重置输入值!

    根据文档:

    https://docs.angularjs.org/api/ng/type/form.FormController

    $setPristine(); 将表单设置为其原始状态。

    可以调用此方法来删除“ng-dirty”类并设置 形成其原始状态(ng-pristine 类)。这种方法也会 传播到此表单中包含的所有控件。

    当我们需要时,将表单设置回原始状态通常很有用 在保存或重置表单后“重新使用”表单。

    $setUntouched();将表单设置为未触及状态。

    可以调用这个方法来移除 'ng-touched' 类并设置 将控件设置为未触及状态(ng-untouched 类)。

    将表单控件设置回其未触及状态通常很有用 将表单设置回其原始状态时。

    $setPristine 和 $setUntouched 仅更改表单控件的类,而不更改值。这意味着您仍然需要重置这些值。

    【讨论】:

    • 感谢您对重置的提醒,我在发布问题后意识到这一点。只是一个快速的额外问题。我是否可以只重置我的问题中链接的对象。 aka object: {manythingshere: "asdasda"} to object: {} 这会删除/重置验证吗?
    • 是的,只需将对象重置为 {}。示例 plunkr:plnkr.co/edit/cGgnbtwnc47BHnFGB3QA
    • 由于“深入”的解释以及文档链接,将此标记为已接受的答案。
    【解决方案2】:

    我不明白为什么不。

    $scope.clearSection = function(formName){
        var frm = $scope[formName];
        frm.$setPristine();
        frm.$setUntouched();
    };
    

    【讨论】:

      【解决方案3】:

      是的。

      在 JavaScript 中,您可以使用 [] 表示法访问对象的变量。举个例子

      var str = 'hello';
      var obj = { hello: 'a' };
      console.info(obj[str]); // outputs 'a'
      

      所以如果 formName 是一个字符串,你可以简单地使用

      获取范围的属性
      var form = $scope[formName]
      

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2021-06-05
        • 2013-09-08
        • 1970-01-01
        • 1970-01-01
        • 2018-12-15
        • 2020-03-26
        • 2015-09-15
        • 1970-01-01
        相关资源
        最近更新 更多