码迷,mamicode.com
首页 > 其他好文 > 详细

Angular之【form提交问题】

时间:2015-01-26 22:24:49      阅读:277      评论:0      收藏:0      [点我收藏+]

标签:

前端页面是这样:

  <form class="form-horizontal" role="form" name="LoginForm" >
      <div class="list list-inset">
          <label class="item item-input">
              <input type="text" placeholder="用户名" ng-model="userInfo.username">
          </label>
          <label class="item item-input">
              <input type="password" placeholder="密码" ng-model="userInfo.password">
          </label>
      </div>
      <button type="submit" ng-disabled="LoginForm.$invalid"  class="button button-block button-balanced" ng-click="login()">登录</button>
      <p class="text-center"> <a ui-sref="register">注册</a></p>
    </form>

 而angular是这样的

var McardController = angular.module(‘McardController‘, [ ‘angular-flash.service‘, ‘angular-flash.flash-alert-directive‘ ])
                                .config(function (flashProvider) {
                                    // Support bootstrap 3.0 "alert-danger" class with error flash types
                                    flashProvider.errorClassnames.push(‘alert-danger‘);
                                });

McardController.controller(‘LoginCtrl‘, function($scope, $http, $window, $location, flash, LoginService, $ionicPopup, $state) {
    $scope.userInfo = {};//这里如果没有初始化,表单提交过来是接收不到数据的。这个地方值得我们注意下

/*     $http.get(‘/api/login‘)
          .success(function(data){
            
          //  $scope.cards = data;
            }).error(function(data){

                console.log(‘Error:‘+data);
            });*/
    $scope.failed_login = "";
    $scope.login = function() {
      console.log($scope.userInfo);
        $scope.$parent.failed_login = "";
            var user = {"username": $scope.userInfo.username, "password": $scope.userInfo.password};
            console.log(user);
            
            if($scope.userInfo.username!==undefined || $scope.userInfo.password !==undefined){
            //    $http({method: ‘POST‘, url: ‘/api/login‘, user:user}).
            $http.post(‘/api/login‘, $scope.userInfo).
                    success(function(data, status, headers, config) {
                        console.log("login success");
                        flash.success = "Success";
                       // $window.location.href="/configure";
                       $location.path(‘/configure‘);
                    }).
                      error(function(data, status, headers, config) {
                         var alertPopup = $ionicPopup.alert({
                        title: ‘登录失败!‘,
                        template: ‘请检查你的账号!‘
                       });
                    });
            }      
/*        LoginService.loginUser($scope.userInfo).success(function(data) {
          
       //   var user = {"username": $scope.username, "password": $scope.password};

             $http.post(‘/api/signup‘, $scope.userInfo)
                .success(function(data){
                $location.path(‘/home‘);
            }).error(function(data){
                console.log(‘Error:‘+data);
            });
            $state.go(‘tab.dash‘);
        }).error(function(data) {
            var alertPopup = $ionicPopup.alert({
                title: ‘登录失败!‘,
                template: ‘请检查你的账户!‘
            });
        });*/
    }

})

  

Angular之【form提交问题】

标签:

原文地址:http://www.cnblogs.com/seasonxin/p/4251362.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!