如何在angularjs中使用`ngMessages`表单验证答案

【问题标题】：How to use `ngMessages` form validation in angularjs如何在angularjs中使用`ngMessages`表单验证
【发布时间】：2018-08-20 17:55:21
【问题描述】：

我是 angularjs 的新手，我需要帮助找出我做错了什么。我正在使用ngMessages 进行表单验证，但表单提交不起作用。

这是我的代码：

angular.module("myapp", ["ngMessages"])

p {
  color: red;
}

<script src="https://code.angularjs.org/1.7.2/angular.js"></script>
<script src="https://code.angularjs.org/1.7.2/angular-messages.js"></script>
<div ng-app="myapp">
  <form name="myform" method="post" novalidate>

    <label>Username</label>
    <input type="text" name="username" ng-model="inputName" ng-minlength="6" ng-maxlength="12" ng-pattern="/^\w+$/" required>
    <div ng-messages="myform.username.$error">
      <p ng-message="minlength">Username should have at least 6 characters.</p>
      <p ng-message="maxlength">Username should have at most 12 characters.</p>
      <p ng-message="required">Providing a username is mandatory.</p>
      <p ng-message="pattern">Username can only be alphanumeric with an optional underscore.</p>
    </div>
    <input type="submit" name="submit">
  </form>
</div>

【问题讨论】：

Angular 通常不直接发布表单。常见的模式是在控制器上调用一个方法，然后使用$http.post()（直接或更优选地通过服务）将数据发布到服务器。
@abu，我的回答有效吗？还是您需要更多信息

标签： javascript angularjs forms

【解决方案1】：

基本上你需要使用ng-submit，

<form name="myform" ng-submit="submit(myform.$valid)" novalidate>

然后在你的控制器中，你需要定义一个方法submit

$scope.submit = function(isValid){
    if(isValid){
       $http.post('your_post_url_here',your_form_data).then(function(success){
             // success message
       })
    }
}

【讨论】：