javascript - 输入类型=电子邮件元素的 AngularJS ng-model 绑定(bind)问题

标签 javascript html angularjs

我有一个奇怪的问题。 不会记录电子邮件输入值,但会记录密码值。 大家有什么想法吗?

<div class="container" ng-controller="loginCtrl">
    <div class="row" style="height: 50px;">&nbsp;</div>
    <div class="row">

        <div class="col-xs-4 col-xs-offset-4" >

            <div class="form-group">
                <label for="emailinput">Email address</label>
                <input type="email" class="form-control" id="emailinput"
                       ng-model="user.email"
                       placeholder="Enter Email Address">
            </div>
            <div class="form-group">
                <label for="passwordinput">Password</label>
                <input type="password" class="form-control" id="passwordinput"
                       ng-model="user.pass"
                       placeholder="Enter Password">
            </div>
            <div class="form-group">
                <button class="btn btn-primary ladda-button"
                        ng-click="verifyCredentials()"
                        data-style="expand-left">
                     <span class="ladda-label">Login</span>
                </button>
            </div>
            <div class="form-group">
                <label for="passwordinput">
                    <a href="forgotpassword.html">Forgot Password?</a>
                </label>
            </div>

        </div>
    </div>
</div>

我的 Angular 代码如下。

var app = angular.module('bookie',[]);

app.controller('loginCtrl', function($scope, $http){
    $scope.user = {};
    $scope.verifyCredentials = function(){
        console.log($scope.user);
    }
});

最佳答案

电子邮件仅在是合法电子邮件地址时才会显示:

<script src="//unpkg.com/angular/angular.js"></script>
<div ng-app ng-init="user={}">
    <div class="form-group">
        <label for="emailinput">Email address</label>
        <input type="email" class="form-control" id="emailinput"
               ng-model="user.email"
               placeholder="Enter Email Address">
    </div>
    <div class="form-group">
        <label for="passwordinput">Password</label>
        <input type="password" class="form-control" id="passwordinput"
               ng-model="user.pass"
               placeholder="Enter Password">
    </div>
    <div class="form-group">
        <button class="btn btn-primary ladda-button"
                ng-click="verifyCredentials()"
                data-style="expand-left">
             <span class="ladda-label">Login</span>
        </button>
    </div>
    <div class="form-group">
        <label for="passwordinput">
            <a href="forgotpassword.html">Forgot Password?</a>
        </label>
    </div>

     {{user | json}}
</div>

关于javascript - 输入类型=电子邮件元素的 AngularJS ng-model 绑定(bind)问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45133880/

相关文章:

javascript - 如何使用可变函数调用创建顺序 promise 循环

javascript - JQuery 单页淡入/淡出切换(带导航)

javascript - 如何重命名 native 窗口函数以便删除两行?

javascript - 如何创建 html 工具提示

javascript - 不能使用字母 x 开始 Angular 中的 html 属性

javascript - jQuery attr() 无法设置属性

html - 在 DIV 中调整 SVG 的大小并且不保留纵横比

javascript - 通过 tag->id->element 使用 javascript 获取嵌套元素

javascript - 成功后如何显示服务器的json?

javascript - ng-grid 无限滚动 - ngGridEvent Scroll 发出两次