用AngularJS提交表單

我對AngularJs非常新，我正在嘗試提交表單。我用yeoman生成角度應用程序。這是在main.html中文件用AngularJS提交表單

<div class="jumbotron"> 
    <h3>Test</h3> 
    <br><br> 
    <p class="lead"> 
    <form name="userForm" ng-submit="loadData()" ng-controller="myCtrl"> 
     <!-- NAME --> 
     <div class="form-group" ng-class="{ 'has-error' : userForm.name.$invalid && !userForm.name.$pristine }"> 
      <label>name*</label> 
      <input type="text" name="name" ng-model="name"class="form-control" ng-model="user.name" required> 
     </div> 
     <br><br> 
     <button type="submit" class="btn btn-primary">submit</button> <br><br> 
    </form> 
    </p> 
</div>

的代碼，這是代碼在main.js文件

angular.module('myApp') 
    .controller('MainCtrl', ['$scope', function($scope) 
    { 



$scope.loadData = function() { 
console.log('submited') 
}; 

}]);

的loadData函數永遠不會被調用。當我將代碼添加到main.js文件時，我開始在控制檯中出現錯誤，我不知道它是否與問題有關。

Warning: Task "jshint:all" failed. Use --force to continue. 

Aborted due to warnings.

來源

2017-02-20 user567

你已經在你的代碼掉毛的問題，你的代碼是正確的。只需格式化您的代碼，並檢查任何失敗的短缺規則 – Yaser

在.html和.js中比較您的控制器名稱...它們不同（myCtrl和MainCtrl） –

''元素錯誤，有兩個'ng-model'指令。 – georgeawg

<div ng-app="myApp" ng-controller="MainCtrl" class="jumbotron"> 
<h3>Test</h3> 
<br><br> 
<p class="lead"> 
<form name="userForm" ng-submit="loadData()" > 
    <!-- NAME --> 
    <div class="form-group" ng-class="{ 'has-error' : userForm.name.$invalid && !userForm.name.$pristine }"> 
     <label>name*</label> 
     <input type="text" name="name" ng-model="name"class="form-control" ng-model="user.name" required> 
    </div> 
    <br><br> 
    <button type="submit" class="btn btn-primary">submit</button> <br><br> 
    </form> 
</p> 
</div>

你忘了提ng-app和控制器的名稱不匹配

來源

2017-02-21 02:30:58

用AngularJS提交表單

回答

相關問題