Search code examples
javascriptangularjsangularjs-filter

AngularJS Filter does not work well


I have an array ($scope.names) that contains some simple objects which I am applying some functions to clean the value from diacritics. When I print with console this value it shows me ok. For example: 'La 45 km nord- vest de Bucureşti' it will be 'La 45 km nord- vest de Bucuresti'.

I am applying this method and for another variable ($scope.searchText) to make the searchable compatible. Again, it's fine.

The problem is that even I am standardizing that two variables value, the filter it doesn't work. If I try to search for 'Bucures' it wont show me the object that contains the clean word 'Bucures' (original word 'Bucureş')...

What I have doing wrong?

The full code is here: http://plnkr.co/edit/D5WfiOGd5I3QfcNVdOmr?p=preview

The angular script is that:

var app = angular.module('myApp', []);
app.controller('namesCtrl', function($scope, $filter) {
$scope.names = [
    {
        "adresa": "Str. Calafatului nr. 10",
        "latitudine": "44.1",
        "localitatea": "GALICEA MARE",
        "longitudine": "23.3",
    },
    {
        "adresa": "bd. Elisabeta nr. 1",
        "latitudine": "44.170901",
        "localitatea": "CONSTANŢA",
        "longitudine": "28.663195",
    },
    {
        "POTLOGI": "La 45 km nord- vest de Bucureşti",
        "latitudine": "44.564319",
        "localitatea": "POTLOGI",
        "longitudine": "25.588091",
    }
]

$scope.searchText = "";
$scope.searchCleanText = "";
$scope.myFilter = function (items) {
    for (var i = 0; i < items.length; i++) {
        var boolChk = false;
        angular.forEach(items[i], function (value, key) {
            var cleanValue = removeDiacritics(value).toLowerCase();
            if (boolChk === false) {
                boolChk = cleanValue.includes($scope.searchCleanText);
            }
            console.log(value + ' ' + cleanValue.includes($scope.searchCleanText) + '\tboolChk = ' + boolChk);
            return boolChk;
        });
    }
}

$scope.$watch('searchText', function() {
        $scope.searchCleanText = removeDiacritics($scope.searchText).toLowerCase();         
        $scope.showItems = $filter('filter')($scope.names, $scope.searchText, $scope.myFilter($scope.names));
        console.log($scope.showItems);
    });
});

Solution

  • The answer it was using the 'function (actual, expected)' to return a boolean value:

    $scope.functionFilter = function (actual, expected) {
        if (typeof actual === 'object') {
            var obj = actual;
            //console.log(obj);
    
            var boolChk = false;
            angular.forEach(obj, function (value, key) {
                var cleanValue = removeDiacritics(value).toLowerCase();
                if (boolChk === false) {
                    boolChk = cleanValue.includes($scope.searchCleanText);
                }
            });
            console.log(obj);
            console.log(boolChk);
            return boolChk;
        }
    }