Validating search parameters in an Angular $scope

Question

I am using the following function to make a specific filter passing the $scope.searchParams in this way:

<tbody ng-repeat="user in users | customFilter:searchParams "> ...

$scope.updateSearch = function() {

    var searchParams = {},
      loginArr = [],
      nameArr = [],
      statusArr = [],
      accountsArr = [],
      profileArr = [];

    if($scope.search.name !== undefined && /\S/.test($scope.search.name)){
      //$scope.tags.push({ text: 'Nombre: ' + $scope.name });
      nameArr.push($scope.search.name);
      searchParams['name'] = nameArr;
    }
    if($scope.search.login !== undefined && /\S/.test($scope.search.login)){
      //$scope.tags.push({ text: 'Nombre: ' + $scope.name });
      loginArr.push($scope.search.login);
      searchParams['login'] = loginArr;
    }
    if($scope.search.status !== undefined && /\S/.test($scope.search.status)){
      //$scope.tags.push({ text: 'Nombre: ' + $scope.name });
      statusArr.push($scope.search.status);
      searchParams['merchant.status'] = statusArr;
    }
    if($scope.search.accounts !== undefined && /\S/.test($scope.search.accounts)){
      //$scope.tags.push({ text: 'Nombre: ' + $scope.name });
      accountsArr.push($scope.search.accounts);
      //accountsArr.push('500092');
      searchParams['merchant.accounts'] = accountsArr;
    }
    if($scope.search.profiles !== undefined && /\S/.test($scope.search.profiles)){
      //$scope.tags.push({ text: 'Nombre: ' + $scope.name });
      accountsArr.push($scope.search.profiles);
      searchParams['merchant.accounts'] = accountsArr;
    }
    $scope.searchParams = searchParams;
  };

In this case I have to filter based on 5 fields ('login','name','status','account' and 'profile'). This is not optimum if I need 10 or more fields to filter. How can I do this more generic?

Answer 1

If you can wrap your arrays into an object and keep their names in line with the search attributes, you can have:

<tbody ng-repeat="user in users | customFilter:searchParams "> ...

$scope.updateSearch = function() {

//  Uncomment to test the following block in console:
//  var $scope = {search: {login:'log1', status:'status0'}};

    var searchParams = {},
      arr = { // Initialise arrays (if needed?)
        login: [],
        name: [],
        status: [],
        accounts: [],
        profiles: []
      };

    Object.keys($scope.search).forEach(
      e => {if(/\S/.test($scope.search[e])) {
        arr[e].push($scope.search[e]);
        searchParams[e] = arr[e];
      }}
    );

    $scope.searchParams = searchParams;
  };

If you definitely need renaming:

<tbody ng-repeat="user in users | customFilter:searchParams "> ...

$scope.updateSearch = function() {

//  Uncomment to test the following block in console:
//  var $scope = {search: {login:'log1', status:'status0'}};

    var searchParams = {},
        loginArr = [],
        nameArr = [],
        statusArr = [],
        accountsArr = [],
        profileArr = [];

    function mapSearch(src, arr, sTgt) {
      if(src !== undefined && /\S/.test(src)) {
        arr.push(src);
        searchParams[sTgt] = arr;
      }
    }

    mapSearch($scope.search.name    , nameArr    , 'name');
    mapSearch($scope.search.login   , loginArr   , 'login');
    mapSearch($scope.search.status  , statusArr  , 'merchant.status');
    mapSearch($scope.search.accounts, accountsArr, 'merchant.accounts');
    mapSearch($scope.search.profiles, profileArr , 'merchant.profiles');

    $scope.searchParams = searchParams;
  };