Angularjs 表单验证在js中不起作用

我有以下资料：

<form name="ctrl.form" class="form-horizontal" ng-class="{true: 'has-error'}[submitted && form.email.$invalid]"
      novalidate>

    <div class="form-group" ng-class="{'has-error' : ctrl.form.inputName.$dirty && ctrl.form.inputName.$invalid}">
        <label for="inputName" class="col-sm-2 control-label">Name</label>
        <div class="col-sm-8">
            <input type="text" class="form-control" id="inputName" name="inputName" ng-model="ctrl.app.name"
                   placeholder="Enter stack name" ng-disabled="ctrl.editMode" ng-required='true'
                   ng-minlength='3' ng-maxlength='32' required/>
        </div>
        <span ng-show="ctrl.form.inputName.$error.required && !ctrl.form.inputName.$pristine" class="help-block">Name is required</span>
        <span ng-show="ctrl.form.inputName.$error.minlength" class="help-block">Name is too short</span>
        <span ng-show="ctrl.form.inputName.$error.maxlength" class="help-block">Name is too long</span>
        <span ng-show="ctrl.form.inputName.$error.pattern" class="help-block">Name has invalid characters</span>
    </div>


    <div class="form-group" ng-class="{'has-error' : ctrl.hasServerErrors}">
        <div class="col-sm-offset-2 col-sm-10">
            <button type="submit" class="btn btn-primary" ng-disabled="ctrl.isCreating"
                    ng-click="ctrl.SubmitForm()">{{ctrl.editMode ? 'Update' :
                ctrl.isCreating? 'Creating': 'Create'}}
            </button>
            <span ng-show="ctrl.hasServerErrors" class="help-block"
                  ng-repeat="serverError in ctrl.serverErrors">
            {{serverError}}
        </span>
        </div>
    </div>
    <div class="alert alert-success" ng-show="ctrl.showUpdateSuccessAlert">
        <strong>Successfully updated!</strong>
    </div>
</form>

名称
名称是必需的
名字太短了
名字太长了
名称包含无效字符
{{ctrl.editMode？'Update'：
ctrl.isCreating？'Creating'：'Create'}
{{serverError}}
已成功更新

现在的问题是，尽管我已经在name中添加了

required标记

，但当我单击submit按钮时，调用仍会转到后端服务，而不会显示name是必需的，必须提供

我在这件事上遗漏了什么？谢谢

<div class="" ng-show="ctrl.form.inputName.$dirty && ctrl.form.inputName.$invalid">
Message which you want to print.
</div>

要打印的消息。

加上这个

希望这对您有所帮助。

要打印的消息。

加上这个

---

希望这对您有所帮助。

您应该在提交表格之前检查表格是否有效

<button type="submit" class="btn btn-primary" ng-disabled="ctrl.form.$invalid"
                ng-click="ctrl.SubmitForm()">{{ctrl.editMode ? 'Update' :
            ctrl.isCreating? 'Creating': 'Create'}}
        </button>

{{ctrl.editMode？'Update'：
ctrl.isCreating？'Creating'：'Create'}

---

当表单无效时，$invalid将为true。

在提交表单之前，您应该检查表单是否有效

<button type="submit" class="btn btn-primary" ng-disabled="ctrl.form.$invalid"
                ng-click="ctrl.SubmitForm()">{{ctrl.editMode ? 'Update' :
            ctrl.isCreating? 'Creating': 'Create'}}
        </button>

{{ctrl.editMode？'Update'：
ctrl.isCreating？'Creating'：'Create'}

---

当表单无效时，$invalid将为true。

如何检查表单是否有效。什么是

isCreating

？您是如何禁用该功能的？您是如何检查表单是否有效的。什么是

isCreating

？您是如何禁用它的？这会起作用，但会禁用“创建”按钮本身，直到输入所有字段。我真正想要的是浏览器级验证（HTML），它不起作用。也就是说，浏览器会发出诸如“请输入一个值或请在列表中选择一个项目”之类的消息。然后您必须在问题中正确地提到这一点。@Rahi.Shah，我理解。这是我的一个错误。好吧，现在请根据您的适当要求提出一个问题，比如您需要在浏览器级别进行验证，而不是通过angular js？这可以工作，但这会禁用“创建”按钮本身，直到输入完所有字段。我真正想要的是浏览器级验证（HTML），它不起作用。也就是说，浏览器会发出诸如“请输入一个值或请在列表中选择一个项目”之类的消息。然后您必须在问题中正确地提到这一点。@Rahi.Shah，我理解。这是我的一个错误。好吧，现在请问一个符合你要求的问题，比如你需要在浏览器级别进行验证，而不是通过js？