按 Enter 键时 AngularJS 表单未提交

我试图在用户按 Enter 键时提交登录表单。 单击“登录”按钮时，该表单工作得很好，但按 Enter 不起作用，而且会导致奇怪的行为：

• 关联的函数ng-submit没有被执行
• 按 Enter 后不再显示错误消息（登录失败）

这是我的标记：

<form ng-submit="login()" class="login-form">
    <div class="alert alert-danger" ng-class="{ 'display-hide': !showError }">
        <button class="close" data-close="alert"></button>
            <span> Login failed </span>
    </div>
    <div class="form-group">
        <label class="control-label visible-ie8 visible-ie9">Username</label>
        <input class="form-control form-control-solid placeholder-no-fix" type="text" autocomplete="off" placeholder="Username" name="username" ng-model="username"/>
    </div>
    <div class="form-group">
        <label class="control-label visible-ie8 visible-ie9">Password</label>
        <input class="form-control form-control-solid placeholder-no-fix" type="password" autocomplete="off" placeholder="Password" name="password" ng-model="password"/>
    </div>
    <div class="form-actions">
        <button class="btn btn-success uppercase">Login</button>
    </div>
</form>

请注意，我尝试替换<button...> with <input type="submit"...>也没有成功。

具有 login() 函数的相应控制器如下所示：

.controller('LoginCtrl', ['$rootScope', '$scope', ..., function LoginController ($rootScope, $scope, ...) {
    $scope.showError = false;

    $scope.login = function()
    {
        console.log("logging in");
        $http({
            url: $scope.apiEndpointLogin,
            method: 'POST',
            data: {'username': this.username, 'password': this.password}
        }).then(function(response) {
            $scope.showError = false;

            [...]
        }, function() {
            $scope.showError = true;
        });

    };
}]);

我运行 Angular v1.4.0 并使用 Angular-ui-router v.0.2.15 进行路由。

感谢您的任何意见，非常感谢。

放这个

 <input type="submit" class="btn btn-success uppercase" value="Login" > 

代替

 <button class="btn btn-success uppercase">Login</button>

对于表单提交按钮应该是提交类型。

编辑代码：

<form   class="login-form"  ng-submit="login()" >
    <div class="alert alert-danger" ng-class="{ 'display-hide': !showError }">
        <button class="close" data-close="alert"></button>
            <span> Login failed </span>
    </div>
    <div class="form-group">
        <label class="control-label visible-ie8 visible-ie9">Username</label>
        <input class="form-control form-control-solid placeholder-no-fix" type="text" autocomplete="off" placeholder="Username" name="username" ng-model="username"/>
    </div>
    <div class="form-group">
        <label class="control-label visible-ie8 visible-ie9">Password</label>
        <input class="form-control form-control-solid placeholder-no-fix" type="password" autocomplete="off" placeholder="Password" name="password" ng-model="password"/>
    </div>
    <div class="form-actions">
        <input  type="submit" class="btn btn-success uppercase"  >
    </div>

</form>

另请检查您是否登录控件位于表单 DOM 之上。

编辑代码：

请检查这个Plunker http://plnkr.co/edit/NdYMqjSO8bMgLR6cIuvV?p=preview