Attempting AngularJS custom filter that pulls numbers out of block of text

Question

What I would like to create is a filter which will pull the numbers out of text that is put in a text box. For example:

User types: The cat went to 4 stores and bought 3 bags of cat litter for 1 dollar.

Result would be: [4, 3, 1]

The filter will see because of a previous filter ['the', 'cat', 'went', 'to', '4' ...]

So what I tried to create was a for loop that would go through the array and check each item to see if it is in fact a number. However, the for loop breaks the app when it isn't commented out. Any help is appreciated.

filter('showNum', function() {    
//   this filter is not complete but it will return only numbers from an array
    return function isNumeric(title){
    var numbers, i, len, numberToAdd;
    numbers = [];
    len = title.length;

//      for(i=0; i<len; i+=1){
//          numberToAdd = title[i]; 
//          if(!isNAN(numberToAdd)===False);    {numbers.push(numberToAdd);} 
    return numbers;
      };

  })

Using regular expression is more practical. "The cat went to 4 stores and bought 3 bags of cat litter for 1 dollar.".match(/\b\d+\b/g) returns 4,3,1 — Walter Chapilliquen - wZVanG
– Walter Chapilliquen - wZVanG, Commented Jun 20, 2015 at 13:32

Glorfindel · Accepted Answer · 2021-05-26 05:48:21Z

1

I would change the filter to something like this:

javascript

.filter('showNum', function() {
  return function(input) {

    if (!input)
    {
      return [];
    }

    return input
      .split(' ')
      .filter(function(item){
        return item && !isNaN(item);
      })
      .map(function(item){
        return parseInt(item);
      })
    
  };
});

html

  <body ng-controller="MainCtrl">
    <input type="text" ng-model="input">
    <p>result: {{ input | showNum }}</p>
  </body>

enter image description here

http://plnkr.co/edit/Hp91dIXbThzvnwzIFbVn?p=preview

edited May 26, 2021 at 5:48

Glorfindel

22.8k13 gold badges97 silver badges124 bronze badges

answered Jun 20, 2015 at 13:52

Jossef Harush Kadouri

34.6k10 gold badges143 silver badges133 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Giuseppe Romagnuolo · Accepted Answer · 2015-06-20 13:52:42Z

0

wZVanG is correct, here is a revisit of your function using the regular expression but respecting the signature of the filter so that it returns an int array and takes an array as parameter.

 filter('showNum', function() {    
    //this filter returns only numbers from an array
        return function isNumeric(title){
        var numbers, i, len, numberToAdd;
        numbers = [];
        var theString = title.toString();

        var numbersAsStrings = theString.match(/\b\d+\b/g);

       numbersAsString.forEach(function(s){
           numbers.push(parseInt(s));
       });

       return numbers;

 })

answered Jun 20, 2015 at 13:52

Giuseppe Romagnuolo

3,4122 gold badges32 silver badges38 bronze badges

Collectives™ on Stack Overflow

Attempting AngularJS custom filter that pulls numbers out of block of text

2 Answers 2

http://plnkr.co/edit/Hp91dIXbThzvnwzIFbVn?p=preview

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related