Angularjs 使用angular js在html表中搜索_Angularjs

Angularjs 使用angular js在html表中搜索

angularjs

Angularjs 使用angular js在html表中搜索,angularjs,Angularjs,这是我的html表。我已经用angular js绑定了这个表 <body ng-app> <div class="wrapper wrapper-content" ng-controller="InboxMailCtrl"> <div class="input-group-btn"> <button type="submit" ng-model="search" class="btn btn-sm btn-

这是我的html表。我已经用angular js绑定了这个表

<body ng-app>
    <div class="wrapper wrapper-content" ng-controller="InboxMailCtrl">
        <div class="input-group-btn">
            <button type="submit" ng-model="search" class="btn btn-sm btn-primary">
                Search
            </button>
        </div>
        <table class="table table-hover table-mail">
            <tbody>
                <tr ng-repeat="CU in InboxList">
                    <td class="mail-ontact"><a href="" ng-click="ViewEmailDetails(CU.InboxMailID)">{{CU.Reciever}}</a></td>
                    <td class="mail-subject"><a href="" ng-click="ViewEmailDetails(CU.InboxMailID)">{{CU.Subject}}</a></td>
                </tr>
            </tbody>

        </table>
    </div>

我为实现搜索功能而添加的内容

除非您希望过滤已获取的结果，假设搜索方法为/MailRoute/getDataForDraftMail，否则您希望执行以下操作：

var InboxDraftMailCtrl = function ($scope, $http) {
    BindDraftMailList();

function BindDraftMailList(Data) {
    debugger
    var UserEmail = sessionStorage.getItem("loginUserID");
    var obj = {
        data: UserEmail
    }
    debugger
    $http({
        url: "MailRoute/getDataForDraftMail",
        dataType: 'json',
        method: 'POST',
        data: obj,
        headers: {
            "Content-Type": "application/json"
        }
    }).success(function (response) {

    })
           .error(function (error) {
               alert(error);
           });
}

var InboxDraftMailCtrl = function ($scope, $http) {

      $scope.Search = function(){
      $http({
      url: "MailRoute/getDataForDraftMail",
      dataType: 'json',
      method: 'POST',
      data: obj,
      headers: {
        "Content-Type": "application/json"
    }}).success(function (response) {

        // Fetch what you want from response
        $scope.InboxList = response.data.emails; // Something like this
    })//. etc
}

在html按钮中，单击应为：

<button type="submit" ng-click="Search();" class="btn btn-sm btn-primary">
        Search
 </button>


搜寻

您可以使用angularJS的过滤方法。Filter方法从数组中选择项的子集，并将其作为新数组返回。将html代码编写为

 <body ng-app>
  <div class="wrapper wrapper-content" ng-controller="InboxMailCtrl">
    <div class="input-group-btn">
        <button type="submit" ng-model="search" class="btn btn-sm btn-primary">
            Search
        </button>
     </div>
     <table class="table table-hover table-mail">
        <tbody>
            <tr ng-repeat="CU in InboxList| filter:search">
                <td class="mail-ontact"><a href="" ng-click="ViewEmailDetails(CU.InboxMailID)">{{CU.Reciever}}</a></td>
                <td class="mail-subject"><a href="" ng-click="ViewEmailDetails(CU.InboxMailID)">{{CU.Subject}}</a></td>
            </tr>
        </tbody>

    </table>


搜寻

此链接将有助于解决您的问题。

显然没有尝试简单的网络搜索，例如

角度搜索

，或者会找到，而许多其他结果没有解释为什么要这样做OK。我会提供的。事实上，我正在更新我的答案。好吧，至少我理解的问题是，他想使用搜索按钮在服务器端创建http.post请求，并获取与搜索词匹配的电子邮件。如果是的话，你的答案是不正确的。另一方面，他并没有很好地解释他想要什么。