无法在提交表单

时间:2015-11-13 05:57:02

标签: javascript angularjs

我尝试在角度上使用“VM”约定。但是在提交表单时遇到了问题。

function loginCtrl($scope, $window, $location, Auth) {
     var vm = this;
     vm.doLogin = function(){
         var data = angular.copy(vm);
         console.log(data);

}

我的Html:

 <div class="panel-body" ng-controller="loginCtrl as login">
        <form class="form-horizontal m-t-20" ng-submit="login.doLogin()">

            <div class="form-group ">
                <div class="col-xs-12">
                    <input class="form-control" type="text" required="" placeholder="Username" ng-model="login.email">
                </div>
            </div>

            <div class="form-group">
                <div class="col-xs-12">
                    <input class="form-control" type="password" required="" placeholder="Password" ng-model="login.password">
                </div>
            </div>

            <div class="form-group text-center m-t-40">
                <div class="col-xs-12">
                    <button ladda="login.loading" class="btn btn-pink btn-block text-uppercase waves-effect waves-light" type="submit">
                        Log In </button>
                </div>
            </div>
        </form>

    </div>

如果我改变

  vm.doLogin to $scope.doLogin 

它可以完美地打印日志。

但是当我使用vm.doLogin时,没有任何反应。表格不会提交。 我试过改变

  ng-submit to doLogin() without "login." 

仍然无法正常工作。

如何在不使用$ scope的情况下仍然使用vm.doLogin?

1 个答案:

答案 0 :(得分:1)

以下是演示http://jsfiddle.net/a94v2u76/ JS

var app = angular.module('myApp', []);
app.controller('loginCtrl', loginCtrl);
function loginCtrl($scope, $window, $location) {
 var vm = this;
 vm.doLogin = function(user){
     console.log(user);         
  }
}

html

 <div ng-app='myApp'>
 <div class="panel-body" ng-controller="loginCtrl as login">
 <form class="form-horizontal m-t-20" ng-submit="login.doLogin(user)">
   <div class="form-group ">
       <div class="col-xs-12">
          <input class="form-control" type="text" required="" placeholder="Username" ng-model="user.email">
      </div>
  </div>
  <div class="form-group">
     <div class="col-xs-12">
         <input class="form-control" type="password" required="" placeholder="Password" ng-model="user.password">
     </div>
  </div>
  <div class="form-group text-center m-t-40">
     <div class="col-xs-12">
        <button ladda="login.loading" class="btn btn-pink btn-block text-uppercase waves-effect waves-light" type="submit">Log In </button>
     </div>
  </div>
 </form>
 </div>
 </div>

希望这可以帮到你