Wie kann ich AngularJS Filter für Suchfunktionalität mit dieser json Struktur verwenden?eckig js Filter für Suchfunktionalität
$scope.jsonObj = {
idNo1: {
name: "Diljish",
age: 24
},
idNo2: {
name: "Shemeem",
age: 28
}
}
Wenn Sie es in einem zu filter ng-wiederholen Sie einen Filter mit einem Rohr verwenden können "|":
<div ng-repeat="person in people | filter: customFilter">
</div>Dann wird in dem Controller, den Sie definieren die customfilter:
$scope.customfilter = function (person) {
return (person.name == $scope.nameToBeFiltered)}
Dabei ist "nameToBeFiltered" der Name, den Sie filtern möchten (Sie können diese Scope-Variable ng-model an eine Eingabe in der Ansicht modellieren).
Jetzt, wenn Sie woanders filtern möchten, suchen Sie vielleicht nach einem "Javascript: Wert in Json finden" statt AngularJS.
Schauen Sie sich diese:
ähnliche Frage: ng-repeat :filter by single field
Dokumentation: https://docs.angularjs.org/api/ng/filter/filter
Keine JavaScript-Code erforderlich ist.
sollten Sie input erstellen für Daten zu filtern, um:
Filter: <input type="text" ng-model="yourFilter.name"/>
Dann in ng-repeat:
<table>
<tr>
<th>Name</th>
<th>Age</th>
</tr>
<tr ng-repeat="person in persons | filter:yourFilter | orderBy:'name'">
<td>{{ person.name | uppercase}}</td>
<td>{{ person.age | lowercase}}</td>
</tr>
</table>
Wo persons Ihr json Objekt ist.
(function()
{
var yourController=function($scope) {
$scope.persons= [];
function init() {
$scope.persons={
idNo1: {
name: "Diljish",
age: 24
},
idNo2: {
name: "Shemeem",
age: 28
}}
}
init();
};
yourController.$inject=['$scope'];
angular.module('yourApp').controller('yourController',
yourController);
}());
Update:
Es bleibt das gleiche, wenn Sie ein anderes json Objekt verwenden:
<body ng-init="people=[{ name:'Shemmem' }, { name:'Diljish' }]">
Filter: <input type="text" ng-model="yourFilter.name"/>
<table>
<tr>
<td>Name</td>
<td>City</td>
</tr>
<tr ng-repeat="person in people | filter:yourFilter">
<td>{{ person.name }}</td>
<td>{{ person.city }}</td>
</tr>
</table>
</body>
@Diljish bitte, meine aktualisiert Abschnitt in einer Antwort sehen. – StepUp
@Diljish zögern Sie keine Frage zu stellen. Wenn Sie meinen, dass meine Antwort Ihnen hilft, dann können Sie meine Antwort als eine Antwort markieren, um die zukünftige Suche nach anderen Personen zu vereinfachen. Bitte lesen Sie diese http://meta.stackexchange.com/questions/5234/how-does-accepting-an-answer-work – StepUp
Bitte Arbeitscode.
Hatte Filter für "name"
(function(angular) {
'use strict';
angular.module('app', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.filtertext="";
$scope.jsonObj = {
idNo1: {
name: "Diljish",
age: 24
},
idNo2: {
name: "Shemeem",
age: 28
}
}
$scope.filterByName = function(items,filtertext) {
var result = {};
angular.forEach(items, function(value, key) {
if (value.name.toLowerCase().indexOf(filtertext) > -1) {
result[key] = value;
}
});
return result;
}
}]);
})(window.angular);<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Example - example-select-with-default-values-production</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.js"></script>
</head>
<body ng-app="app">
<div ng-controller="ExampleController">
<input type="text" ng-model="filtertext"/>
<hr>
<div ng-repeat="(k,v) in filterByName(jsonObj,filtertext)">
{{k}} {{v.name}}
</div>
</div>
</body>
</html>
wie wollen Sie diese gefiltert werden? – vistajess
Je nach Name – Diljish