AngularJS 1.4.1 ng-submit 表单重置后未触发

Question

我知道有一些与相关主题相关的旧问题，但我还没有找到满意的答案，而且这些答案似乎是针对旧版本的 Angularjs。

我的问题是一个带有角度验证的表单，并且 ng-submit 在提交一次后不会触发，即使在模型数据已重置并且表单未被触及并设置为原始状态之后也是如此。

第一次提交后，表单会按预期在视觉上重置，如果第二次使用会正确验证，包括在验证通过时激活提交按钮。在任何提交之前和重置之后比较表单代码会产生相同的 HTML。单击提交会按设计显示预加载器。但是 ng-submit 操作不会触发...

    $scope.resetMediaForm = function() {

        $scope.uploadMedia = {};
        $scope.uploadMedia.from = ''
        $scope.uploadMedia.message = ''
        $scope.uploadMedia.file = null;
        $scope.uploadMedia.fileType = '';
        $scope.uploadMedia.fileName = '';
        $scope.uploadMedia.done = false;
        $scope.uploadMedia.error = '';

        if ($scope.mediaForm) {
            $scope.mediaForm.$setUntouched();
            $scope.mediaForm.$setPristine();
            //$('form[name="'+$scope.mediaForm.$name+'"]')[0].reset();
        }

    };

    $scope.resetMediaForm();

    $scope.uploadMedia.submit = function() {

        var data = {
                from: $scope.uploadMedia.from,
                message: $scope.uploadMedia.message,
                file: $scope.uploadMedia.file,
                fileType: $scope.uploadMedia.fileType,
                fileName: $scope.uploadMedia.fileName
            };

        plotRemoteAPI.postMedia(data, function (data, status) {
            if (status >= 200 && status < 300) {
                if (data.success === true) {
                    $scope.resetMediaForm();
                } else {
                    $scope.uploadMedia.error = data.error;
                }   
            } else {
                $scope.uploadMedia.error = status;
            }
        }, function (data, status) {
            $scope.uploadMedia.error = data.error;
        });
    };

Plunkr：http://embed.plnkr.co/zO3lEqa7sfqYDvjHRnqa/preview

Answer 1

您在提交处理程序中调用 $scope.resetMediaData(); 会破坏 $scope.uploadMedia 对象，包括您的提交函数（并且不会重新声明）。我刚刚将$scope.uploadMedia = {}; 移到resetMediaData() 函数之外。

http://plnkr.co/edit/OhRwsfnx3rX3gXZ2bilc?p=preview