Angular 1x: filter data from 2 columns only

angularjs filter multiple values
angularjs filter in controller
angular filter function
angularjs custom filter
angularjs filter array
angularjs filter ng-repeat
angularjs multiple filters
angularjs custom filter in controller

I have query about Angular 1x. I want to filter the below records if anything matches with title and content only. I tried giving ng-model to my input and applied the same like ng-repeat= t in t.items | filter:keyword but it is filtering the data with link and all other columns as well.

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"}
        ];

    }]);

Is it possible to filter data from 2 just columns?

Edit

I have a <input type="search" /> and I want to filter data as soon as user starts typing but it should search the keywords in just two columns.

Have a look at https://docs.angularjs.org/api/ng/filter/filter it explains everything pretty good. For your question you can do it like:

Component's controller:

$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;
};

Then in component's template:

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

angularjs - Angular 1x: filter data from 2 columns only, Have a look at https://docs.angularjs.org/api/ng/filter/filter it explains everything pretty good. For your question you can do it like: Component's  What i want is if you see search text box it searches search.city via filter. i want to search city as well as address via one text box only. is this possible ? Re: How to Use Filter to filter multiple columns from one textbox

Another approach:

$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)
    }
}

Then you just have to use the ng-repeat over $scope.filterResult

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

and you just have to use ng-model with $scope.filterParams, and every time you change the filter just call $scope.filter() and the $scope.filterResult will be updated.

Angular 1x: filter data from 2 columns only - angularjs - html, Angular 1x: filter data from 2 columns only - angularjs. content: "lorem ipsum doler pixel"} ]; }]); Is it possible to filter data from 2 just columns? Edit I have a  Angularjs filter table columns or rows example. By using filter property we can filter table rows / columns data with input text

you can achieve this by using this approach

ng-repeat=" t in t.items | filter: {'title': 'Cars'}: true"

filter, Note: If the array contains objects that reference themselves, filtering is not possible. Note that a named property will match properties on the same level only, Comparator which is used in determining if values retrieved using expression search across all fields when filtering with a string', function() { var searchText  Trigger Mat Menu => Inject dynamically a filter component and giving it the name of the column => The filter returns a ColumnPredicate based on the information filled up => dataSource.filterPredicate is updated with the predicate and a fake value is sent to trigger the filter => Filtering is done

AngularJS: Developer Guide: Filters, This site and all of its contents are referring to AngularJS (version 1.x), if you are E.g. the markup {{ 1234 | number:2 }} formats the number 1234 with 2 decimal In general, this applies only to filters that take primitive values as inputs. By this, the controller is able to call the filter only when needed (e.g. when the data is​  Angular Material 9/8 DataTables, Pagination, Sorting, Filter & Fixed Columns Tutorial Last updated on May 3, 2020 Jolly.exe Angular Material is a Material Design based UI library which provides a number of easy to use UI components.

Angular Grid, ag-Grid is a feature-rich Angular Grid available in Free or Enterprise versions. of ag-grid-angular / @ag-grid-community/angular will support Angular 6+ only. Add ag-Grid to Your Project; Enable Sorting and Filtering; Fetch Remote Data of the grid - the column definitions ( columnDefs ) and the data ( rowData ). In our​  The filter function should be a pure function, which means that it should always return the same result given the same input arguments and should not affect external state, for example, other AngularJS services. AngularJS relies on this contract and will by default execute a filter only when the inputs to the function change.

Angular Filters, Filters can be added in AngularJS to format data. The filter filter can only be used on arrays, and it returns an array containing only the matching items. In this article, I'm sharing the great concepts and code samples of Angular 6 and 7 custom Pipe for filtering or searching table by one or multiple columns data ( using by Angular 2, 4, 5, 6,7,8 and 9).

Comments