为什么我的电子邮件标记传递空电子邮件属性?

时间:2015-06-09 08:29:25

标签: javascript html angularjs

嗨我有这个表格用于注册,出于某种原因,当我输入完成.com的电子邮件时,该值不会传递给范围变量。

验证来自其他来源,仅根据我的需求进行调整。

register.html

<a class="navbar" href="#/welcome" style="color: #000000;"> <<< Home</a>

<div class="intro-header fadein">
    <div class="container">
        <div class="row">
            <div class="col-lg-4">
                <div class="page-header" >
                    <h1 style="color: black; text-align: left">Register</h1>
                </div>
                <form name="register_form" novalidate ng-submit="register()">
                    <div class="input-group">
                        <input type="email"
                               name="email"
                               class="form-control"
                               placeholder="Email"
                               ng-model="user.email"
                               ng-maxlength=20
                               required/>
                        <div class="error fadein"
                             ng-show="register_form.email.$dirty && register_form.email.$invalid">
                            <small class="error fadein"
                                   ng-show="register_form.email.$error.required" style="color: black">
                                Your email is required.
                            </small>
                            <small class="error fadein"
                                   ng-show="register_form.email.$error.email" style="color: black">
                                Please input a valid email.
                            </small>
                        </div>
                    </div>
                    <div class="input-group">
                        <input type="text"
                               name="username"
                               class="form-control"
                               placeholder="Username"
                               ng-model="user.username"
                               ng-minlength=3
                               ng-maxlength=20
                               ensure-unique="username"
                               required
                               />
                        <div class="error fadein"
                             ng-show="register_form.username.$dirty && register_form.username.$invalid">
                            <small class="error fadein"
                                   ng-show="register_form.username.$error.required" style="color: black">
                                Your username is required.
                            </small>
                            <small class="error fadein"
                                   ng-show="register_form.username.$error.minlength" style="color: black">
                                Must be at least 3 characters
                            </small>
                            <small class="error"
                                   ng-show="register_form.username.$error.maxlength" style="color: black">
                                Maximum 20 characters
                            </small>
                            <small class="error fadein"
                                   ng-show="register_form.username.$error.unique" style="color: black">
                                This username is taken.</br>
                                Please choose another one.
                            </small>
                        </div>
                    </div>
                    <div class="input-group">
                        <input type="password"
                               name="password"
                               class="form-control"
                               placeholder="Password"
                               ng-model="user.password"
                               ng-minlength="8"
                               ng-maxlength="20"
                               required>
                        <div class="error fadein"
                             ng-show="register_form.password.$dirty && register_form.password.$invalid">
                            <small class="error fadein"
                                   ng-show="register_form.password.$error.required" style="color: black">
                                Your password is required.
                            </small>
                            <small class="error fadein"
                                   ng-show="register_form.password.$error.minlength" style="color: black">
                                Must be at least 8 characters
                            </small>
                            <small class="error fadein"
                                   ng-show="register_form.password.$error.maxlength" style="color: black;">
                               Maximum 20 characters
                            </small>

                        </div>
                    </div>
                    <input type="submit" class="btn btn-default" id="register_button" value="Register">
                </form>

            </div>

        </div>
    </div>
    <!-- /.container -->
</div>

authCtrl.js

angular.module('theNotesApp')
    .controller('authCtrl',['$scope', '$state', 'Auth',  function($scope, $state, Auth) {
        $scope.login = function() {
            Auth.login($scope.user).then(function () {
                $state.go('home');
            });
        };
        $scope.register = function() {
            console.log($scope.user);
            Auth.register($scope.user).then(function () {
                $state.go('home');
            });
        };
    }])

enter image description here

我是Web开发的新手。欢迎对代码提出改进建议。

1 个答案:

答案 0 :(得分:1)

您已在输入字段中输入ng-maxlength 20,类型为&#39; email&#39;。您在提供的示例中使用的电子邮件地址长度为21个字符,因此无效,Angular不会将其分配给user.email。

要么增加ng-maxlength,要么更好的选择是完全摆脱它。