我创建了一个形式离子角和应用上it.Validations验证工作不properly.Even所有领域都在提交按钮它调用控制器功能的点击空。请帮我解决这个问题。

HTML code

 ＆LT;离子面板＆GT;＆LT;离子标题栏类=扎稳＆GT;＆LT; H1类=标题＆GT;注册＆LT; / H1＆GT;＆LT; /离子头吧＆GT;＆LT;离子含量＆GT;＆LT;表格名称=注册NG提交=submitDetails（用户）NOVALIDATE =＆GT;    ＆LT; D​​IV CLASS =清单＆GT;        ＆LT;标签类=逐项输入项浮动标签的风格=的位置是：相对的;＆GT;            ＆LT;跨度类=输入标签＆gt;首先名称和LT; / SPAN＆GT;            ＆LT;输入类型=文本占位符=名NG-模式=user.firstNameNG-所需=真＆GT;            ＆LT; p NG秀=$ user.firstName无效和放大器;＆安培;！user.firstName $质朴。阶级=求助块方式＆gt;需要你的姓名和LT; / P＆GT;        ＆LT; /标签＆gt;        ＆LT;标签类=逐项输入项浮动标签＆GT;            ＆LT;跨度类=输入标签＆GT;电子邮件和LT; / SPAN＆GT;            ＆LT;输入类型=电子邮件占位符=电子邮件NG-模式=user.emailNG-所需=真＆GT;            ＆LT; p NG秀=$ user.email无效和放大器;＆安培;！user.email $质朴。阶级=帮助块＆GT;输入有效的电子邮件＆LT; / P＆GT;        ＆LT; /标签＆gt;        ＆LT;标签类=逐项输入项浮动标签＆GT;            ＆LT;跨度类=输入标签＆GT;联系电话：LT; / SPAN＆GT;            ＆LT;输入类型=数字占位符=联系电话NG模型=user.phoneNG-MINLENGTH个=10NG-MAXLENGTH =10NG-所需=真＆GT;            ＆LT;跨度类=帮助块NG秀=。user.phone $ error.required || user.phone $ error.number＆GT;有效的电话号码是必需的＆LT; / SPAN＆GT;            ＆LT;跨度类=帮助块NG秀=（（$ user.phone || error.minlength $ user.phone error.maxlength）及。和放大器; user.phone $脏）＆GT;电话号码应为10位数＆LT; / SPAN＆GT;        ＆LT; /标签＆gt;        ＆LT;输入类型=提交级=按钮按钮皇家值=注册＆GT;    ＆LT; / DIV＆GT;＆LT; /表及GT;＆LT; /离子含量＆GT;＆LT; /离子面板＆GT; 

控制器code

  chatApp.controller（'RegisterCntrl'，函数（$范围，$ stateParams）{    $ scope.user = {};    $ scope.submitDetails =功能（用户）{        警报（用户+ user.firstName）;    };}）; 

解决方案

这应该工作

 ＆LT;表格名称=register_form中NG提交=submitDetails（用户）NOVALIDATE =＆GT;    ＆LT; D​​IV CLASS =清单＆GT;        ＆LT;标签类=逐项输入项浮动标签的风格=的位置是：相对的;＆GT;            ＆LT;跨度类=输入标签＆gt;首先名称和LT; / SPAN＆GT;            ＆LT;输入类型=文本名称=USER_FIRST_NAME占位符=名NG-模式=user.firstNameNG-所需=真＆GT;            ＆LT; p NG秀=$ register_form.user_first_name无效和放大器;＆安培;！register_form.user_first_name $质朴。阶级=帮助块＆gt;您的名字是必需的＆LT; / P＆GT;        ＆LT; /标签＆gt;        ＆所述;！ - 省略 - ＆GT;        ＆LT;输入类型=提交级=按钮按钮皇家值=注册＆GT;    ＆LT; / DIV＆GT;＆LT; /表及GT; 

窗体名称为 register_form中，

 ＆LT;表格名称=register_form中NG提交=submitDetails（用户）NOVALIDATE =＆GT; 

输入名称为 USER_FIRST_NAME ，

 ＆LT;输入类型=文本名称=USER_FIRST_NAME占位符=名NG-模式=user.firstNameNG-所需=真＆GT; 

所以，验证必须穿过这些领域

 ＆LT; p NG秀=register_form.user_first_name $无效和放大器;＆安培;！register_form.user_first_name $质朴。阶级=帮助块＆gt;您的名字是。需要＆LT; / p＆GT; 

模式本身并不具备 $无效或 $质朴的属性，所以它没有任何意义

有关手机领域

 ＆LT;输入类型=数字NAME =USER_PHONE占位符=联系电话NG模型=user.phoneNG-MINLENGTH个=10NG-最大长度=10NG-需要=真＆GT;＆LT;跨度类=帮助块NG秀=。register_form.user_phone $ error.required || register_form.user_phone $ error.number＆GT;有效的电话号码是必需的＆LT; / SPAN＆GT;＆LT;跨度类=帮助块NG秀=（（$ register_form.user_phone || error.minlength $ register_form.user_phone error.maxlength）及。和放大器; register_form.user_phone $脏）＆GT;电话号码应为10位数＆LT; / SPAN＆GT; 

有关进一步的读数，结账这个答案

I have created a form in ionic-angular and applied validations on it.Validations are not working properly.Even all the fields are empty on click of submit button it calls controller function. Please help me to solve this issue.

html code

<ion-pane>
<ion-header-bar class="bar-stable">
<h1 class="title">Register</h1>
</ion-header-bar>
<ion-content >
<form name="register"  ng-submit="submitDetails(user)" novalidate=""> 
    <div class="list">
        <label class="item item-input item-floating-label" style="position:relative;">
            <span class="input-label">First Name</span>
            <input type="text" placeholder="First Name" ng-model="user.firstName" ng-required="true">
            <p ng-show="user.firstName.$invalid && !user.firstName.$pristine" class="help-block">You name is required.</p>
        </label>
        <label class="item item-input item-floating-label">
            <span class="input-label">Email</span>
            <input type="email" placeholder="Email" ng-model="user.email" ng-required="true">
            <p ng-show="user.email.$invalid && !user.email.$pristine" class="help-block">Enter a valid email</p>
        </label>
        <label class="item item-input item-floating-label">
            <span class="input-label" >Phone no</span>
            <input type="number" placeholder="Phone No" ng-model="user.phone" ng-minlength="10" ng-maxlength="10" ng-required="true">
            <span class="help-block" ng-show="user.phone.$error.required || user.phone.$error.number">Valid phone number is required</span>
            <span class="help-block" ng-show="((user.phone.$error.minlength || user.phone.$error.maxlength) && user.phone.$dirty) ">phone number should be 10 digits</span>
        </label>
        <input type="submit" class="button button-royal"  value="register">
    </div>
</form>
</ion-content>
</ion-pane>

Controller code

chatApp.controller('RegisterCntrl', function($scope, $stateParams) {
    $scope.user={};
    $scope.submitDetails=function(user){
        alert("user"+user.firstName);
    };
});

This should work

<form name="register_form"  ng-submit="submitDetails(user)" novalidate=""> 
    <div class="list">
        <label class="item item-input item-floating-label" style="position:relative;">
            <span class="input-label">First Name</span>
            <input type="text" name="user_first_name" placeholder="First Name" ng-model="user.firstName" ng-required="true">
            <p ng-show="register_form.user_first_name.$invalid && !register_form.user_first_name.$pristine" class="help-block">You name is required.</p>
        </label>
        <!--omitted-->
        <input type="submit" class="button button-royal"  value="register">
    </div>
</form>

Form name is register_form,

<form name="register_form"  ng-submit="submitDetails(user)" novalidate="">

Input name is user_first_name,

<input type="text" name="user_first_name" placeholder="First Name" ng-model="user.firstName" ng-required="true">

So validation must pass through those fields

  <p ng-show="register_form.user_first_name.$invalid && !register_form.user_first_name.$pristine" class="help-block">You name is required.</p>

Model itself doesn't have $invalid or $pristine properties, so it doesn't make sense

For phone field

<input type="number" name="user_phone" placeholder="Phone No" ng-model="user.phone" ng-minlength="10" ng-maxlength="10" ng-required="true">
<span class="help-block" ng-show="register_form.user_phone.$error.required || register_form.user_phone.$error.number">Valid phone number is required</span>
<span class="help-block" ng-show="((register_form.user_phone.$error.minlength || register_form.user_phone.$error.maxlength) && register_form.user_phone.$dirty) ">phone number should be 10 digits</span>

For further readings, checkout this answer