Filter first letter doesn't work in AngularJS

Question

Last time i have posted my problem here how filter the first letter in a data, and someone helped me on how to do it. But when I try to add it to my project I don't know where I put the startsWithA filter function to the ng-repeat that filtered the data. Any idea how fix it? Thanks again.

dting · Accepted Answer

After fixing:

customerCrtl (js) -> customerCtrl (html)
startsWithA (js) -> startWithA (html)
missing "|" before limitTo (html)

I found the problem is that you aren't escaping the letters in the ng-clicks:

ng-click="letter = [AB]"

You need:

ng-click="letter = '[AB]'"

$scope.letters always is [null]. [AB] evaluates to [null] because $scope.AB is not defined. And then when you try to use the startsWithA filter when $scope.letters is [null] you never return any filtered items.

I got the snippet working below.

var app = angular.module('app', ['ui.bootstrap']);

var student = [{
  name: 'Andrew'
}, {
  name: 'Butler'
}, {
  name: 'Cameron'
}, {
  name: 'Delo'
}, {
  name: 'Emman'
}, {
  name: 'Ferbs'
}];

app.filter('startFrom', function() {
  return function(input, start) {
    if (input) {
      start = +start; //parse to int
      return input.slice(start);
    }
    return [];
  }
});

app.controller('customersCtrl', function($scope, $timeout) {

  $scope.list = student;
  $scope.currentPage = 1; //current page
  $scope.entryLimit = 10; //max no of items to display in a page
  $scope.filteredItems = $scope.list.length; //Initially for no filter
  $scope.totalItems = $scope.list.length;

  $scope.setPage = function(pageNo) {
    $scope.currentPage = pageNo;
  };

  $scope.filter = function() {
    $timeout(function() {
      $scope.filteredItems = $scope.filtered.length;
    }, 10);
  };


  $scope.sort_by = function(predicate) {
    $scope.predicate = predicate;
    $scope.reverse = !$scope.reverse;
  };



});

app.filter('startsWithA', function() {
  return function(items, letter) {
    console.log(items, letter)
    var filtered = [];
    var letterMatch = new RegExp(letter, 'i');
    for (var i = 0; i < items.length; i++) {
      var item = items[i];
      if (letterMatch.test(item.name.substring(0, 1))) {
        filtered.push(item);
      }
    }
    console.log(filtered);
    return filtered;
  };
});








  
    
      
        Student List
      
      
        
          
            
              
            
          
        
      
      
        
          
            
              A-B 
              
              C-D 
              
              E-F 
              


            
          
        
      
      
        
          
            

              
                Name 
                  
                
              

            
          
          
            
              {{data.name}}
            
          
        
        
          
            
              No results found

Filter first letter doesn't work in AngularJS

Answers (1)

Related Questions

Filter first letter doesn&#39;t work in AngularJS

Answers (1)

Related Questions

Filter first letter doesn't work in AngularJS