角度表單不提交第一次點擊

我已經建立了一個小角度的應用程序到我的網站，用戶輸入一個searchterm到輸入字段，然後通過角度服務返回值。但是，當我嘗試提交價值時，表單不會提交，只會在第二次提交時提交。我無法弄清楚爲什麼會發生這種情況。這裏是我的代碼：角度表單不提交第一次點擊

<div ng-app="clubFilter" class="col-lg-12"> 
<div class="col-lg-3"> 

</div> 
<div class="col-lg-9" ng-controller="clubController">  
    <form ng-submit="filterClubs()"> 
     <input type="text" name="location" ng-model="searchTerm" placeholder="Search..." /> 
     <input type="submit" name="submit" value="Submit" /> 
    </form> 
    <ul class="leisure-centres">    
     <li ng-repeat="club in clubs">    
      <div class="centre"> 
       <a class="link" ng-href="{club.link}">More info</a> 
       <div class="image" ng-show="club.image > 0"> 
        <img src="{{image}}" alt="{{club.title}}" />       
       </div> 
       <div class="details"> 
        <div class="title"> 
         <h3>{{club.title}}<span ng-show="club.distance > 0"> - {{club.distance}} miles away</span></h3> 
        </div> 
        <div class="address"> 
         {{club.building}}, 
         {{club.street}}, 
         {{club.city}}, 
         {{club.county}}, 
         {{club.postcode}}       
        </div> 
        <div class="tel"> 
         <strong>Tel: </strong> 
         <a href="tel:{{club.telephone}}" ng-bind="club.telephone"></a> 
        </div> 
        <div class="email"> 
         <strong>Email: </strong> 
         <a href="mailto:{{club.email}}" ng-bind="club.email"></a> 
        </div> 
       </div> 
      </div> 
     </li>   
    </ul> 
</div> 
</div> 
var JSONItems = <?php echo $this->JSONItems; ?>;  
var searchTerm = "<?php echo $this->searchTerm; ?>";

這裏是我的角度控制器

angular.module('clubFilter.controllers', []). 
controller('clubController', function($scope, $http, googleMapService) { 
    $scope.keyWord = "SEARCH"; 
    $scope.clubsJSON = JSONItems; 
    if(searchTerm == "") {   
     $scope.clubs = $scope.clubsJSON;   
    } else { 
     $scope.searchTerm = searchTerm;  
     googleMapService.setLatLng($scope.searchTerm, $scope.clubsJSON).then(function(sortedArray) {    
      $scope.$apply(function() { 
       $scope.clubs = sortedArray;     
      });   
     }, function(err) { 
      alert("no"); 
     });   
    }  

    $scope.filterClubs = function() {  
     googleMapService.setLatLng($scope.searchTerm, $scope.clubsJSON).then(function(sortedArray) {     
      $scope.clubs = sortedArray; 
     }, function(err) { 
      alert("no"); 
     }); 
    }  
});

據我所知，我已經定義了理所應當的一切嗎？謝謝

來源

2014-09-30 devoncrazylegs

試試這個;

<div class="col-lg-9" ng-controller="clubController as club">  
    <form ng-submit="club.filterClubs()"> 
     <input type="text" name="location" ng-model="club.searchTerm" placeholder="Search..." /> 
     <input type="submit" name="submit" value="Submit" /> 
    </form>

而在你的控制器;

this.filterClubs = function() {  
    googleMapService.setLatLng(this.searchTerm, $scope.clubsJSON).then(function(sortedArray) {     
     $scope.clubs = sortedArray; 
    }, function(err) { 
     alert("no"); 
    }); 
}

來源

2014-09-30 11:03:09 BKM

角度表單不提交第一次點擊

回答

相關問題