javascript - 关闭前验证 ngDialog openConfirm 中的表单

Question

我有一个打开 ngDialog.openConfirm 的按钮。在该对话框中，我有一个表单，其中包含一个必需的文本区域，并且至少需要 20 个字符。

这是我的代码的简化版本:

someFunction() {
    let newScope = $scope.$new();
    newScope.vm = vm;
    ngDialog.openConfirm({
        scope: newScope,
        template: 'componentDescription.html'
    })
}

还有我的 html:

<form role="form" name="subForm">
   <textarea name="compDesc"
             required="true"
             ng-minlength="20"
             ng-model="vm.compDesc">
   </textarea>
   <button type="button" ng-click="confirm(0)">Submit</button>
   <button type="button" ng-click="closeThisDialog(0)">Cancel</button>
</form>

我希望仅在表单有效时才提交对话框。

我尝试通过在 Controller 中创建一个函数来实现此目的，但是访问表单/关闭对话框时遇到问题。

有什么想法吗？

更新:我已经像这样更改了我的 html:

<form role="form" name="subForm" novalidate ng-submit="confirm(0)">
   <textarea name="compDesc"
             required="true"
             ng-minlength="20"
             ng-model="vm.compDesc">
   </textarea>
   <button type="submit">Submit</button>
   <button type="button" ng-click="closeThisDialog(0)">Cancel</button>
</form>

这在第一次单击时有效，会显示错误消息，但在第二次单击时它会提交表单，即使它无效。似乎每当显示错误消息时，提交按钮都会忽略验证。

Answer 1

您可以手动决定是否调用$scope.confirm()，

通过验证然后调用 $scope.confirm()。

未通过验证，请勿调用 $scope.confirm()。

例如

模板:

<button type="button" ng-click="ok(0)">Submit</button>

Controller :

$scope.ok = function () {
    if(!validationHasPassed()){
        //errorMsg.push('xxx')
        return false;
    }
    $scope.confirm();
};