表單提交不能在angularJS中工作？

Question

我正在開發一個使用Ionic框架進行佈局設計的angularJS應用程序。出於某種原因，我的表單未被提交。該函數應該提交用戶名和密碼並將其發佈到聯機PHP文件中。這裏是我的代碼：

模板：

<ion-view title="Login"> 
    <ion-content overflow-scroll="true" padding="true" class="has-header"> 
<?php include '../lib/init.php'; ?> 
     <form class="list validate" ng-submit="submit()"> 
      <input type="hidden" name="action" value="login"> 
      <ion-list> 
       <label class="item item-input"> 
        <span class="input-label">Username</span> 
        <input type="text" ng-model="username" name="username" placeholder=""> 
       </label> 
       <label class="item item-input"> 
        <span class="input-label">Password</span> 
        <input type="password" ng-model="password" name="password" placeholder=""> 
       </label> 
      </ion-list> 
      <div class="spacer" style="height: 40px;"></div> 
      <button type="submit" id="login-button4" class="button button-royal button-block">Log in</button> 
      <a ui-sref="register" id="login-button5" class="button button-royal button-block button-clear">Dont have an account?</a> 
      <a ui-sref="forgotPassword" id="login-button6" class="button button-royal button-block button-clear">Forgot password?</a> 
     </form> 
    </ion-content> 
</ion-view> 

控制器：

.controller('loginCtrl', function($scope, $state, $stateParams, $ionicPopup, $timeout) { 

    //popup alert starts here 
    $scope.showAlert = function(status,message) { 
    var alertPopup = $ionicPopup.alert({ 
    title: status, 
    template: message, 
    }); 
}; 
//popup alert ends here 


    $scope.submit = function() { 
     if ($scope.username && $scope.password) { 
      var url = 'my PHP file url'; 
      var username= $scope.username; 
      var password= $scope.password; 

      $scope.list = []; 


      var dataString = 'username='+ username + '&password=' + password; 
      $scope.list.push(dataString); 
      $scope.text = ''; 

      $http({ 
      type: "POST", 
      url: url, 
      data: dataString, 
      success: function(data) { 
      try 
      { 
       alert(data); 
      } 
      catch(e) 
      { 
       alert(data); 
      } 
      } 
      }); 


     } 
     }; 

}) 

路線：

.state('login', { 
    url: '/login.php', 
    templateUrl: 'templates/login.php', 
    controller: 'loginCtrl' 
    }) 

有誰知道怎麼回事？

Answer 1

試試這個：

HTML

<form class="list validate" ng-submit="submit(username, password)"> 

的Javascript

$scope.submit = function(usr, pw) { 
    if(!usr || !pw) { 
     alert('empty usr or pw'); 
     return; 
    } 

    //your stuff, not mine 
    $scope.list = []; 
    var dataString = 'username='+ usr + '&password=' + pw; 
    $scope.text = ''; 

    var payload = { 
     username: usr, 
     password: pw 
    }; 

    $http.post('path/to/php/file', payload).then(function(response) { 
     //success 
     alert(response.data); 
    }).catch(function(response) { 
     //an error occurred 
     alert(response.data); 
    }); 
}