ngSubmit没有得到提交

问题描述：

我非常初学者用AngularJS，我试图提交表单，如下所示：ngSubmit没有得到提交

<div ng-include="APP_URL + '/view/myResolver/searchForm.html'" ng-controller="MySearchFormController"> </div>

这是我searchForm.html：

<div class="container"> 
<div class="row"> 
    <div class="col-md-14"> 
     <div class="well"> 
      <div class="col-md-9"> 
       <form ng-submit="submit()" class="form-horizontal clearfix" role="form" > 
         <div class="form-group"> 
          <label for="teamName" class="col-md-3 control-label">Team name</label> 
          <div class="col-md-9"> 
           <input type="text" ng-model="myName" id="myName" class="form-control"> 
          </div> 
         </div> 
      </div> 
<div class="row"> 
       <div class="col-md-0"></div> 
        <button ng-click="onFormReset()" class="btn btn-default">Reset</button> 
        <input type="submit" id="submit" class="btn btn-primary" value="Search"/> 
</div> 
       </form> 

      {{teamName}} 
     </div> 
    </div> 
</div>

UPDATE

控制器：

angular.module('MyApp') 
    .controller('MySearchFormController', ['$scope', function($scope){ 
    $scope.submit = function(){ 

     if ($scope.myName) { 
     alert($scope.myName); 
     $scope.teamName = this.teamName; 
     } 
    } 
    }]);

当前发生的事情是文本自动出现在{{teamName}}字段中。相反，我想让它只在onSubmit（）上工作，即单击Search按钮。

你可以显示你的控制器吗？ – 2014-09-25 09:52:11

我刚刚编辑它。 – thitami 2014-09-25 09:57:59

实际上'this.teamName'引用'$ scope.submit'方法的范围。我想你想要做'$ scope.teamName = $ scope.myName;' – meriadec 2014-09-25 10:30:11

答

你可以尝试这样的：

function demo ($scope) { 
 
    
 
    $scope.submit = function() { 
 
    $scope.submitted = true; 
 
    }; 
 
    
 
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<div ng-app ng-controller="demo"> 
 

 
    <form ng-submit="submit()"> 
 
    <input type="text" ng-model="teamName"> 
 
    <button>Submit</button> 
 
    </form> 
 
    
 
    <p ng-if="submitted">{{ teamName }}</p> 
 
    
 
</div>

但这是不是最佳的，因为一旦你提交一次，$scope.submitted是true，你会得到同样的问题，再一次。

SO，我建议你不要绑定您{{ teamName }}到同一基准输入：

function demo ($scope) { 
 
    
 
    $scope.submit = function() { 
 
    
 
    $scope.teamNameCopy = angular.copy($scope.teamName); 
 
    
 
    }; 
 
    
 
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<div ng-app ng-controller="demo"> 
 
    
 
    <form ng-submit="submit()"> 
 
    <input type="text" ng-model="teamName"> 
 
    <button>Submit</button> 
 
    </form> 
 
    
 
    <p>{{ teamNameCopy }}</p> 
 
    
 
</div>

感谢分享它，meriadec。您的代码片段包含了我正在尝试执行的操作，但是在我的代码中可能存在另一个问题，因为它还没有运行。顺便说一句，如何编辑主题的主题？它应该*而不是*而不是*现在*。 – thitami 2014-09-25 10:21:34

答

OK，问题解决了。

不幸的是，这是一个与错误地关闭html标签有关的问题，而不是

ngSubmit没有得到提交

相关推荐