AngularJS - $filter inside controller

by zachreynolds

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<div ng-app>
  <div ng-controller="MyCtrl">
    <input type="text" ng-model="search">
    <ul>
      <li ng-repeat="item in items | filter:filterText">
        {{item.name}}: {{item.phonenumber}}
      </li>
    </ul>
  </div>
</div>

JavaScript

function MyCtrl($scope, $filter, $timeout) {


  $timeout(function() {
    $scope.search = '418 123 1234';
    //$scope.filterText = '418 123 1234';
  }, 1000);


  $scope.items = [{
    "id": 1,
    "phonenumber": "(581) 200-9823",
    "name": "Roger Tremblay"
  }, {
    "id": 2,
    "phonenumber": "418-412-1512",
    "name": "Pascal Duma"
  }, {
    "id": 3,
    "phonenumber": "+14181231234",
    "name": "Jean-René Dufort"
  }, {
    "id": 4,
    "phonenumber": "418 123 1234",
    "name": "Jean-Marc Mitchel"
  }, {
    "id": 5,
    "phonenumber": "1 (800) 234-2345  Poste #234",
    "name": "Gouvernement"
  }];


  $scope.items2 = $scope.items;

  $scope.$watch('search', function(val) {
    $scope.items = $filter('filter')($scope.items2, val);
  });
  
  
  setTimeout(function(){ 
  $('input').val("234-2345");  
  }, 2000);


};