gaurav.s23 Ответов: 2

Angular JS filter точный поиск совпадений только в одном столбце

Как реализовать фильтр поиска точного совпадения только для одного столбца, а остальные не должны быть точным совпадением.

Допустим, у меня есть таблица сотрудников с именем сотрудника и другими деталями. Я хотел бы отфильтровать имя, когда оно точно совпадает, но я хочу оставить все остальное.

Как мне сделать это простым способом?

Что я уже пробовал:

HTML:

<html>
<head>
    <meta charset="utf-8" />
    <title></title>

    <style>
        table  {
            border-style: solid;
            border-collapse:collapse;
        }

        th {
            border-style: solid;
        }
        td {
            border-style: solid;
        }
    </style>
</head>
<body ng-app="mymodule">
    <div ng-controller="myController">
        <table>
            <thead>
                <tr>
                    <th>Name</th>
                    <th>Gender</th>
                    <th>Salary</th>
                    <th>City</th>
                </tr>
                <tr>
                    <th><input type="text" ng-model="searchText.name" /></th>
                    <th><input type="text" ng-model="searchText.gender" /></th>
                    <th><input type="text" ng-model="searchText.salary" /></th>
                    <th><input type="text" ng-model="searchText.city" /></th>
                </tr>
            </thead>
            <tbody>
                <tr ng-repeat="employee in employees | filter:searchText">
                    <td> {{ employee.name }} </td>
                    <td> {{ employee.gender }} </td>
                    <td> {{ employee.salary }} </td>
                    <td> {{ employee.city }} </td>
                </tr>
            </tbody>
        </table>
    </div>
</body>
<script src="Scripts/angular.min.js"></script>
<script src="JavaScript.js"></script>
</html>


Угловой:
var app = angular.module("mymodule", []);

app.controller("myController", function ($scope) {
    var employees = [
    { name: "Ben", gender: "Male", salary: 55000, city: "London" },
    { name: "Sara", gender: "Female", salary: 68000, city: "Newyork" },
    { name: "Mark", gender: "Male", salary: 57000, city: "Ashland" },
    { name: "Pam", gender: "Female", salary: 53000, city: "Hongkong" },
    { name: "Todd", gender: "Male", salary: 60000, city: "London" },];
    $scope.employees = employees;

    $scope.flag = function () {
        if ($searchText.name === employees.name) {
            return true;
        }
    }
});

2 Ответов

Рейтинг:
12

gaurav.s23

Не беспокойтесь, ребята. Я сделал это. это и есть решение. 


angular:
$scope.OnEmpNameChange= function (empName) {
                console.log(empName);
                debugger;
                $scope.Reports = $scope.allEmployees;
                if (empName != "") {
                    console.log(empName);
                    debugger;
                    var newArray = [];
                    newArray = $scope.employees.filter(function (r) {
                        if (r.empName == empName) {
                            return r;
                        }
                    });
                     $scope.employees = newArray;
                }
                else {
                    $scope.employees = $scope.allEmployees;
                }
            }
			
			
			HTML:
			 <input type="text" ng-model="empName" ng-change="OnEmpNameChange(empName)" />

Graeme_Grant

Пожалуйста, не отвечайте на свой собственный вопрос решением, а затем примите его как действительное решение. Это считается респектабельным фермерством и может привести к тому, что вы будете забанены, если продолжите. Вместо этого обновите свой вопрос.

Рейтинг:
0

gaurav.s23

Я попробовал этот способ, он работает для столбца name, но я не смог отфильтровать его по имени других столбцов.

<tr ng-repeat="employee in employees |filter:{'name':searchText.name}:true |filter:searchText">
                    <td > {{ employee.name }} </td>
                    <td> {{ employee.gender }} </td>
                    <td> {{ employee.salary }} </td>
                    <td> {{ employee.city }} </td>
                </tr>

Karthik_Mahalingam

это решение или комментарий?

[no name]

Это не было решением, так как это не решило мою проблему. Я смог отфильтровать столбец имени как требование, но не смог отфильтровать другие столбцы.

Graeme_Grant

Пожалуйста, не отвечайте на свой собственный вопрос решением, а затем примите его как действительное решение. Это считается респектабельным фермерством и может привести к тому, что вы будете забанены, если продолжите. Вместо этого обновите свой вопрос.