JSFiddle - React, Tailwind, and code Playground

by Octavianus

HTML

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css">
<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
<div data-ng-controller="dashboard_controller">
    
<h1>
    Texts
    <input type="text" data-ng-model="text_filter"  placeholder="Text Distributors">
</h1>

    <div>
        <ul data-ng-repeat="t in allText | distributorName: text_filter">
           {{t.text}}  --  {{t.id}}
        </ul>
    </div>
</div>

JavaScript

angular.module('myApp', [])
    .controller("dashboard_controller", function ($scope) {
    $scope.allText = [
    	{text: 'This is first text from the array.', id: 21}, 
      {text: 'Text in this array is dummy and it makes no sense', id: 32}, 
      {text: 'AngularJS is very old framework', id: 64}
      ];
}).filter('distributorName', function() {
  return function(items, filterValue) {
      if (!filterValue){
          return items;
      }  
      var result = [];
      
        angular.forEach(items, function(value, key) {
            var text = value.text;
            
            var hasse = "((\\w+)?)"+filterValue+"((\\w+)?)";
	
            var re = new RegExp(hasse, 'g');
            var hasMatches = text.match(re) !== null
            
            if (hasMatches) {
            	//Uncomment the line below
              // value.text = text.match(re)[0]
              result.push(value)
            }
        });
        return result;
    };
});