Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
​
<script src="https://unpkg.com/angular@1.6.x/angular.js"></script>
​
<div ng-app="app" ng-controller="MyCtrl as $ctrl">
  <input type="text" ng-model="something" placeholder="Type to trigger $digest">
  <p class="filterCount"></p>
  <ul>
    <li ng-repeat="person in $ctrl.orderedPeople">
      {{ person.name }}
    </li>
  </ul>
</div>
​
 
console.clear();
​
angular.module('app', [])
​
.decorator('orderByFilter', $delegate => {
  var filterCount = 0;
  return (...args) => {
    filterCount++;
    document.querySelector('.filterCount').innerHTML = 
      'Filter count (orderBy): ' + filterCount;
    return $delegate(...args);
  };
})
​
.controller('MyCtrl', function($scope, orderByFilter) {
  this.people = [{
    "name": "Terra Winckle"
  }, {
    "name": "Lorne Bernollet"
  }, {
    "name": "Nicolette Van Niekerk"
  }, {
    "name": "Salomon Ranklin"
  }, {
    "name": "Nomi Shillabeer"
  }, {
    "name": "Terra Neely"
  }];
  
  $scope.$watchCollection('$ctrl.people', people => {
    this.orderedPeople = orderByFilter(people, 'name');
  });
});
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
petebacondarwinpro
0viewers