Fatal编程技术网
  • angularjs/
  • 如何使用AngularJS表单检查查询参数是否为空

如何使用AngularJS表单检查查询参数是否为空

angularjs jersey

如何使用AngularJS表单检查查询参数是否为空,angularjs,jersey,angularjs-forms,Angularjs,Jersey,Angularjs Forms,我有一个项目，我使用查询参数，这些参数被传递到后端进行搜索 它们是使用AngularJS中的$http.get方法传递的 有些参数不是搜索所必需的，所以我希望它们在为空时不在url中 如何获得此功能 下面是我的代码： <!DOCTYPE html> <html lang="en" ng-app = "searchApp"> <script type="text/javascript"> var searchApp = a

我有一个项目，我使用查询参数，这些参数被传递到后端进行搜索

它们是使用AngularJS中的$http.get方法传递的

有些参数不是搜索所必需的，所以我希望它们在为空时不在url中

如何获得此功能

下面是我的代码：

    <!DOCTYPE html>
    <html lang="en"  ng-app = "searchApp">

     <script type="text/javascript">
     var searchApp = angular.module("searchApp", []);

     searchApp.controller("searchListingsCtrl", ['$scope', '$http', function($scope, $http) {
     $scope.searchListings = function(){        

     if ($scope.checkIn == '') {}
     var searchListingObj = {
            checkIn : $scope.checkIn,
            checkOut : $scope.checkOut,
            country : $scope.country,
            city : $scope.city,
            state : $scope.state,
            accommodates : $scope.accommodates,

     }

    var res = $http.get('http://www.localhost:8080/messenger/webapi/listings', searchListingObj);
    res.success(function(data, status, headers, config) {
        $scope.message = data;
    });
    res.error(function(data, status, headers, config) {
        alert( "failure message: " + JSON.stringify({data: data}));
    });     
    };
}]);
</script>

<body ng-controller="searchListingsCtrl">

   <form action="/listings" name="listings" ng-submit="searchListings()">
        <input type="text" name="neighborhood" placeholder="Neighborhood:" ng-model="state">    
        <input type="text" name="town" placeholder="Town:" ng-model="city">
        <input type="text" name="country" placeholder="Country:" ng-model="country">            
        People:<select class="peopleSelect" placeholder="People:" ng-model="accommodates"> </select> 
        <input type="text" id="arrival" name="arrival" value="Arrival" ng-model="checkIn">
        <input type="text" id="departure" name="depart" value="Departure" ng-model="checkOut">
        <input type="submit" name="submit" value="Search" id="Search_submit">
    </form>
  </body>
对输入使用required属性以防止表单提交空字段：

<form  ̶a̶c̶t̶i̶o̶n̶=̶"̶/̶l̶i̶s̶t̶i̶n̶g̶s̶"̶  name="listings" ng-submit="searchListings()">
    <input type="text" name="neighborhood" placeholder="Neighborhood:"
           ng-model="fdata.state"  ͟r͟e͟q͟u͟i͟r͟e͟d͟ />    
    <input type="text" name="town" placeholder="Town:" 
           ng-model="fdata.city" ͟r͟e͟q͟u͟i͟r͟e͟d͟ />
    <input type="text" name="country" placeholder="Country:"
           ng-model="fdata.country"  ͟r͟e͟q͟u͟i͟r͟e͟d͟ />            
    People:<select class="peopleSelect" placeholder="People:"
                   ng-model="fdata.accommodates"  ͟r͟e͟q͟u͟i͟r͟e͟d͟ /> 
           </select> 
    <input type="text" id="arrival" name="arrival" value="Arrival"
           ng-model="fdata.checkIn"  ͟r͟e͟q͟u͟i͟r͟e͟d͟ />
    <input type="text" id="departure" name="depart" value="Departure"
           ng-model="fdata.checkOut"  ͟r͟e͟q͟u͟i͟r͟e͟d͟ />
    <input type="submit" name="submit" value="Search" id="Search_submit" />
</form>
还要注意，$http.success和.catch方法已被弃用，并已从AngularJS v1.6中删除。相反，请使用.then和.catch方法。

将无法理解您的问题。你能详细解释一下吗？我重新措辞了，请再次检查问题，并询问我任何进一步的信息。你的代码现在是什么样子的？在你的项目中使用lodash，并将代码作为u.compactsearchListingObj，这将删除你对象中的空值字段。否则，您需要使用angular.forEach并单独检查。您不理解我这里的问题。并非所有的输入字段都是必需的，我想检查它们是否为空。如果一个字段为空，我不希望它作为搜索参数。将它们视为过滤器，我想检查它们中的哪一个是过滤器enabled@GeorgeSp，StackOverflow不是代码编写服务。您需要为您试图实现的目标显示代码。如果要创建一个忽略空字段属性的params对象，这是一个很小的问题。 
$scope.fdata = {};
var url = "http://www.localhost:8080/messenger/webapi/listings";

$scope.searchListings = function() {
    var config = { params: fdata };

    $http.get(url, config)
      .then(function(response) {
        $scope.message = response.data;
    })
      .catch(function(response) {
        var data = response.data;
        console.log( "failure message: " + JSON.stringify({data: data}));
        throw response;
    });             

};