Question

如何设置http://staging.api.sample.com/events.json?name=peter和http://staging.api.sample.com/events.json?start_date_from=2015-01-01的网址参数并将其设置为搜索按钮？就像你键入名称“peter”一样，如果你要点击按钮，URL将加载为给定的URL名称“Peter”，然后它将关闭事件表中名为“Peter”的所有列表。 json。搜索字段类似于名称和开始日期。如果您在搜索字段“name”上键入名称Peter，则在“开始日期”上键入，例如2015-01-01。该链接将合并为“ HTTP blah blah /events.json?name=peter&&start_date_from=2015-01-01 ”并搜索是否匹配events.json表。这很有意思吧？任何人都可以帮我解决这个问题吗？有什么建议？代码如下：

  <!DOCTYPE html>
<html ng-app="myTable">
<head>
    <title>project  43</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-rc.0/angular.min.js"></script>
<script type="text/javascript">
    var myTable=angular.module('myTable',[]);
  myTable.controller('tableCtrl',function($scope,$http){
  $http.get("http://staging.api.sample.com/events.json", {headers: {Authorization: 'vuNYhXbpKfH7dxkL4h1o2etBJDEiVrRdsds'}})
   .success(function(response) {
      debugger
    $scope.members=response.events;
     $scope.totals = response.paging;
  });

  });
    </script>
</head>



<body ng-controller="tableCtrl">
 <table border="5">
   <tr>
    <th>Event</th>
     <th>Account Shop</th>
     <th>Place</th>
     <th>Activity</th>
   </tr>

    <tr ng-repeat="member in members">
    <td>

    {{member.Event.name}}<br>  <!--names-->
    {{member.Event.id}}<br>
    {{member.Event.date_start}}<br>   <!--Start Date-->
    {{member.Event.date_end}}<br> 


    <td>
    {{member.AccountShop.id}}<br>
    {{member.AccountShop.name}}<br>
    {{member.AccountShop.short_code}}<br>
    </td>

    <td >
    <div ng-repeat="Place in member.Place">
    {{Place.id}}<br>
    {{Place.name}}<br>
    {{Place.lk_country_code}}<br>
    </div>
    </td>

    <td>
    <div ng-repeat="Activity in member.Activity">
    {{Activity.id}}<br>
    {{Activity.short_description}}
    </div>

    </td>
    </table>
</body>
</html>

Answer 1

尝试以下内容：让我们说你的搜索字段：

<input type="text" class="form-control" ng-model="name" />
<input type="text" class="form-control" ng-model="date" />
<button ng-click="search(name,date)" class="blue_button" >search</button>

和范围的功能是：

var myTable=angular.module('myTable',[]);
      myTable.controller('tableCtrl',function($scope,$http){
      $http.get("http://staging.api.sample.com/events.json", {headers: {Authorization: 'vuNYhXbpKfH7dxkL4h1o2etBJDEiVrRdsds'}})
       .success(function(response) {
          debugger
        $scope.members=response.events;
         $scope.totals = response.paging;
      });

    $scope.search=function(name,date){
         $http.get("http://staging.api.sample.com/events.json?name="+name+"&start_date="+date, {headers: {Authorization: 'vuNYhXbpKfH7dxkL4h1o2etBJDEiVrRdsds'}})
       .success(function(response) {

        $scope.members=response.events;
         $scope.totals = response.paging;
      });

      }
  });

如何在搜索字段上设置和获取URL参数

1 个答案: