在從datalist中選擇一個項目之前，它將移動到另一個頁面

Question

我必須從datalist中選擇一個城市，然後在選擇城市之後，它應該移動到另一個頁面，但在我選擇任何城市之前移動到另一個頁面。我無法弄清楚如何克服這一點，任何幫助將非常可觀

我的HTML：

<label> SEARCH COUPONS </label> 
    <input type="text" list="cityList" class="form-control" placeholder="Select City" ng-model="selectcity" ng-change="searcity(selectcity)" class="form-control"> 
     <datalist id="cityList"> 
      <option ng-repeat="city in cities.results" value="{{city.name}}"> 
     </datalist> 

我的控制器：

$scope.searcity = function (val) { 
     var ciseurl = urlcs + val; 
     $http.get(ciseurl, config).then(function (response) { 
      $scope.cities = response.data; 
      var x = $scope.cities.results; 
      couponSvc.setCityId(x[length].id); 
      $location.path("/couplist"); 
     }); 
     }; 

我試圖$超時服務：

$scope.searcity = function (val) { 
     var ciseurl = urlcs + val; 
     $http.get(ciseurl, config).then(function (response) { 
      $scope.cities = response.data; 
      var x = $scope.cities.results; 
      couponSvc.setCityId(x[length].id); 

     }); 
     $timeout(callme, 3000); 

     function callme(){ 
     $location.path("/couplist"); 
     console.log("Timeout occured, City Selected : " + val);  
     }; 
    }; 

但也有一些問題，如 第一：它從數據列表 第二組第一個項目的cityId：如果用戶不3秒內輸入任何內容移動到的問題是， ng-change="searcity(selectcity)"已被列入後，它馬上叫

另一頁

Answer 1

在DOM中：非常像一個觀察者（所有觀察者在創建之後都會被調用一次）。

爲了克服這個問題，嘗試設置一個簡單的，如果：

$scope.searcity = function (val) { 
    if(val == null) //void the first initialization. 
     return; 
    var ciseurl = urlcs + val; 
    $http.get(ciseurl, config).then(function (response) { 
     $scope.cities = response.data; 
     var x = $scope.cities.results; 
     couponSvc.setCityId(x[length].id); 
     $location.path("/couplist"); 
    }); 
}; 

Answer 2

認沽check.This功能DOM初始化過程中獲取調用。

$scope.searcity = function (val) { 

     if($scope.selectcity){ 
      var ciseurl = urlcs + val; 
      $http.get(ciseurl, config).then(function (response) { 
      $scope.cities = response.data; 
      var x = $scope.cities.results; 
      couponSvc.setCityId(x[length].id); 
      $location.path("/couplist"); 
     }); 
     }; 
}