Question

我只是尝试使用角度函数 $ setPristine ＆amp;重置表单。 $ setUntouched （使用ng-repeat创建了多个表单）我使用语法 {{someName}} 动态分配表单名称（名称在服务器端构建，并作为json（字符串）传递）。
表单的名称在标记中正确分配，验证按预期工作。当我在ng-click =＆＃34; reset（someName）＆＃34;中传递该名称作为参数时，问题就出现了。功能。
调试时，名称以字符串形式出现，而不是导致错误的表单对象。我通过对名称进行硬编码并通过相同的名称进行了快速测试，并且工作正常我的假设是，来自json的名称是一个字符串，类型被转发到函数，而不是对象。
所以问题是：有没有办法转换该名称，以便控制器正确解释它。或者也许还有其他我想念的东西......

以下是标记（请注意表单的名称使用{{resto.contactForm}}）：

<form novalidate name="{{ resto.contactForm }}" ng-submit="submit(restoContact, resto.contactForm.$valid)" class="sky-form">
  <div class="form-group">
    <label class="checkbox state-success">
      <input type="checkbox" ng-model="restoContact.sameAsUser" name="sameAsUser" id="sameAsUser" value="true" ng-click="contactAutoFill()"><i></i>Contact name is same as current user.
      <input type="hidden" name="sameAsUser" value="false" />
    </label>
  </div>
  <div class="form-group">
     <label class="control-label" for="contactName">Contact Name</label>
     <input type="text" ng-model="restoContact.contactName" name="contactName" id="contactName" placeholder="John, Doe" class="form-control" required />
       <div ng-show="{{ resto.contactForm }}.contactName.$error.required && !{{ resto.contactForm }}.contactName.$pristine" class="note note-error">Please enter a name or check the box 'Same as current user'.</div>
   </div>
   <div class="form-group">
     <label class="control-label" for="contactPhoneNumber">Contact Phone Number</label>
     <input type="text" ng-model="restoContact.contactPhoneNumber" name="contactPhoneNumber" id="contactPhoneNumber" placeholder="+1 555-1234-567" class="form-control" required ng-pattern="phoneNumberPattern" />
       <div ng-show="({{ resto.contactForm }}.contactPhoneNumber.$error.required || {{ resto.contactForm }}.contactPhoneNumber.$error.pattern) && !{{ resto.contactForm }}.contactPhoneNumber.$pristine" class="note note-error">Please enter a valid phone number.</div>
    </div>
    <div class="margin-leftM19">
      <button class="btn btn-primary">Save Changes </button>
      <button class="btn btn-default" ng-click="reset(resto.contactForm)">Cancel </button>
    </div>
</form>

这是控制器中的重置功能（形式为＆＃34; contactForm1＆＃34;这是正确的名称，但是字符串而不是对象）：

$scope.reset = function (form) {            
        if (form) {
            form.$setPristine();
            form.$setUntouched();
        }
        //$scope.user = angular.copy($scope.master);
    };

我还没有实现提交方法，但我确定我会遇到同样的问题。欢迎提出任何建议或建议。提前谢谢......

这是fidle.js。变量数据是来自服务器的精确响应 [http://jsfiddle.net/bouchepat/v0mtbxep/]

解：

http://jsfiddle.net/bouchepat/v0mtbxep/3/
我删除了$ setUntouched，因为它抛出了一个错误。

Answer 1

您无法动态命名<form>或<ng-form>。

虽然您想要的是，使表单在控制器中可用。您可以执行以下操作：

// in controller
$scope.form = {};
$scope.reset = function() {
    $scope.form.contact.$setPristine();
    $scope.form.contact.$setUntouched();
};

// in html
<form name="form.contact">

Answer 2

这是因为resto.contactForm 是在作用域上定义的字符串。表单的angular指令只是在作用域上创建一个具有相同名称的变量。要通过字符串获取变量，请使用$ eval。这应该有效：

$scope.reset = function (formName) {            
    var form = $scope.$eval(formName);

    if (form) {
        form.$setPristine();
        form.$setUntouched();
    }
    //$scope.user = angular.copy($scope.master);
};

当作为参数传递时，角形式名称作为字符串传递

2 个答案: