添加对象后在指令中重置表单的方法咨询

我看了你的代码后，发现你之前调用$setPristine()没生效的核心问题是只重置了表单状态，没重置绑定的模型数据，而且要确保正确获取到表单实例。下面给你分步讲最佳实现方式：

关键步骤说明 #

1. 确保能访问到表单实例
   你的表单已经设置了name="addForm"，这很好，在控制器里可以直接通过$scope.addForm拿到这个表单的控制器实例，不用额外做其他操作。

2. 完成添加逻辑后，两步重置表单
   在addEmployee函数里，做完员工添加操作后，需要同时处理模型数据和表单状态：

   • 重置绑定的employee模型，把它恢复成空的初始状态，这样输入框里的内容才会清空；
   • 调用$setPristine()和$setUntouched()，让表单回到「未修改、未触碰」的初始状态，这样验证样式也会跟着恢复。

修改后的完整addEmployee函数 #

$scope.addEmployee = function() {
  // 把当前输入的员工数据复制一份加入列表（避免后续修改影响已添加的数据）
  $scope.employees.push(angular.copy($scope.employee));
  
  // 重置模型数据，清空输入框
  $scope.employee = {
    name: '',
    email: '',
    department: ''
  };
  
  // 重置表单状态，恢复初始的验证样式
  $scope.addForm.$setPristine();
  $scope.addForm.$setUntouched();
};

为什么之前没生效？ #

你之前可能只调用了$setPristine()但没重置模型，导致输入框里还留着之前的内容，看起来表单没重置；或者是在获取addForm实例时出了问题，现在按照上面的方式修改，就能完美实现点击Add后表单重置的效果啦。

内容的提问来源于stack exchange，提问作者Ron T