Угловой 1x: фильтровать данные только из 2 столбцов - PullRequest
Новая
       36

Угловой 1x: фильтровать данные только из 2 столбцов

0 голосов
/ 07 ноября 2018

У меня есть вопрос об Angular 1x. Я хочу отфильтровать записи ниже, если что-нибудь совпадает с заголовком и содержанием. Я попытался указать ng-model для ввода и применил то же самое, что и ng-repeat= t in t.items | filter:keyword, но он также фильтрует данные по ссылке и всем другим столбцам. 

var myApp = angular.module('myApp',[]);

    myApp.controller('SearchController', ['$scope', function($scope) {

        $scope.results = [
            { title : "Cars", link: "http://tutorialedge.net", content: "lorem ipsum doler fox pixel"},
            { title : "Boats", link: "http://tutorialedge.net", content: "lorem ipsum doler cat pixel"},
            { title : "Vans", link: "http://tutorialedge.net", content: "lorem ipsum doler pig pixel"},
            { title : "Limos", link: "http://tutorialedge.net", content: "lorem ipsum doler pixel"}
        ];

    }]);

Можно ли отфильтровать данные только из двух столбцов?

Редактировать

У меня есть <input type="search" />, и я хочу отфильтровать данные, как только пользователь начнет печатать, но он должен искать ключевые слова только в двух столбцах.

Ответы [ 3 ]

0 голосов
/ 07 ноября 2018

Другой подход: 

$scope.filterResult = []
$scope.filterParams = {
    title = "all",
    content = "all"
}
$scope.filter = function (){
    if($scope.filterParams.title == "all" && $scope.filterParams.content == "all") {
        $scope.filterResult = $scope.results
    } else {
        $scope.filterResult = $scope.results.filter(x => 
            x.title == $scope.filterParams.title && 
            x.content == $scope.filterParams.content)
    }
}

Тогда вам просто нужно использовать ng-repeat для $ scope.filterResult 

<div ng-repeat="item in filterResult">

и вам просто нужно использовать ng-модель с $ scope.filterParams, и каждый раз, когда вы меняете фильтр, просто вызывайте $ scope.filter () и $ scope.filterResult будет обновляться.

0 голосов
/ 07 ноября 2018

вы можете достичь этого, используя этот подход 

ng-repeat=" t in t.items | filter: {'title': 'Cars'}: true"
0 голосов
/ 07 ноября 2018

Посмотрите на https://docs.angularjs.org/api/ng/filter/filter, это объясняет все довольно хорошо. По вашему вопросу вы можете сделать это следующим образом:

Контроллер компонента: 

$scope.results = [
        { title : "Cars", link: "http://tutorialedge.net", content: "lorem ipsum doler fox pixel"},
        { title : "Boats", link: "http://tutorialedge.net", content: "lorem ipsum doler cat pixel"},
        { title : "Vans", link: "http://tutorialedge.net", content: "lorem ipsum doler pig pixel"},
        { title : "Limos", link: "http://tutorialedge.net", content: "lorem ipsum doler pixel"}
    ];

$scope.mySubstringExpression = "Vans";

$scope.myFancyFilter = function(element) {
    return element.title.indexOf(mySubstringExpression) > -1 || element.contant.indexOf(mySubstringExpression) > -1;
};

Затем в шаблоне компонента: 

<div ng-repeat="item in results | filter:myFancyFilter">
...