JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/lodash.js/2.4.1/lodash.min.js"></script>
<body ng-app="myApp">
    <div ng-controller="MyCtrl">testing...
       <div ng-repeat="item in list.items| ui.filter.transformFilter:list.transformerFunction:list.search">
          {{item}}
      </div>
      <div ng-repeat="item in list2.items|ui.filter.transformFilter:list2.transformerFunction:list2.search">
         {{item}}
      </div>
  
    </div>
</body>

JavaScript

var myApp = angular.module('myApp', []);

function Filter(list, expression) {
    newlist= list;
    newlist.push(6);
    return newlist;
}

myApp.filter('ui.filter.transformFilter',  function() {
    
    return( _.memoize(function(objects, transformer, expression) {
        var transformed = [];
        for (var i = 0; i < objects.length; i++) {
          transformed[i] = transformer(objects[i]);
        }
        return (filtered = Filter(transformed, expression));
      }, 
      function(objects,transformer,expression){ 
          return objects +transformer.name + expression;
      }
   ));
});

function tfunc(item) {
      newval = {items: item+1};
    return newval;
}
function tfunc2(item) {
    newval = {items: item*10};
    return newval;
}


myApp.controller('MyCtrl', function ($scope) {
    console.log("here2");
    $scope.list={items:[1,2,3,4],transformerFunction:tfunc,search:[1,2]};
    $scope.list2 ={items:[1,2,3,4],transformerFunction:tfunc2,search:[1,2]};

});