如何使用angularjs使用过滤器进行ng-repeat? [英] How to do ng-repeat with filter using angularjs?
本文介绍了如何使用angularjs使用过滤器进行ng-repeat?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
在这里,我添加了我想根据用户输入进行搜索的代码,但是
Here I added my code i want to search based on user input i tried this but
filter: first_name_model
我没有得到正确的结果
例如:运行代码片段
输入"2"并查看结果(我们只需要获取一条记录,但它会显示所有记录)
enter "2" and see the result (we need to get only one record but it showing all records )
输入"as"并查看结果(我们只需要获取一条记录(asif yohana),但显示2条记录)
enter "as" and see the result (we need to get only one record(asif yohana) but it showing 2 records )
我只想过滤这两个字段
1.no
2.DisplayName
2.DisplayName
可能需要使用"OR"条件.
may be need to use 'OR' condition .
帮我前进
angular.module('myApp', []).controller('namesCtrl', function($scope) {
$scope.students = [{
"firstname": "irfan",
"lastname": "k",
"no":"2",
"userid": "5706b916bb729ecc876192d2"
},
{
"firstname": "asif",
"lastname": "Y",
"no":"3",
"userid": "5706b916bb729ecc87619245"
},
{
"firstname": "arun",
"lastname": "D",
"no":"6",
"userid": "5706b916bb729ecd876452d2"
},
{
"firstname": "smart",
"lastname": "k",
"no":"5",
"userid": "5706b916bb729ecc876452d2"
},
{
"firstname": "rajesh",
"lastname": "v",
"no":"4",
"userid": "5706b916bb729ecc87619245"
}
];
$scope.users = [{
"_id": "5706b916bb729ecc87619245",
"DisplayName": "irfan kadhar",
},
{
"_id": "5706b916bb729ecc876192d2",
"DisplayName": "asif yohana",
},
{
"_id": "5706b916bb729ecc876452d2",
"DisplayName": "smar kiran",
},
{
"_id": "5706b916bb729ecd876452d2",
"DisplayName": "arun dinesh ",
}
]
if ($scope.students) {
for (var i = 0; i < $scope.students.length; i++) {
for (var j = 0; j < $scope.users.length; j++) {
if ($scope.students[i].userid == $scope.users[j]._id) {
$scope.students[i].AssignedToDisplayName = $scope.users[j].DisplayName;
}
}
}
}
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<div ng-app="myApp" ng-controller="namesCtrl">
filter data <input type = "text" ng-model = "first_name_model"/><br><br><br>
<table>
<tr>
<th>Number</th>
<th>DisplayName</th>
</tr>
<tr ng-repeat="student in students | filter: first_name_model">
<td><input type="text" ng-model ="student.no"></td>
<td>
<select ng-model="student.userid" placeholder="userid" name="userid{{$index}}">
<option ng-repeat="user in users | orderBy: 'DisplayName'" ng-value="user._id">{{user.DisplayName}}</option>
</select>
</td>
</tr>
</table>
</div>
推荐答案
请将输入的ng-model更改为 first_name_model.no 它对我有用
Please change ng-model of input to first_name_model.no It works form me
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<div ng-app="myApp" ng-controller="namesCtrl">
filter data <input type = "text" ng-model = "first_name_model.no"/><br><br><br>
<table>
<tr>
<th>Number</th>
<th>DisplayName</th>
</tr>
<tr ng-repeat="student in students | filter: first_name_model">
<td><input type="text" ng-model ="student.no"></td>
<td>
<select ng-model="student.userid" placeholder="Assigned To" name="userid{{$index}}" >
<option ng-repeat="user in users | orderBy: 'DisplayName'" ng-value="user._id">
{{user.DisplayName}}</md-option>
</md-select>
</td>
</tr>
</table>
</div>
这篇关于如何使用angularjs使用过滤器进行ng-repeat?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文