AngularJS Bind Once

HTML

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js"></script>
<div id="app" ng-controller="Ctrl">
    BIND
    <ul>
        <li ng-repeat='item in data'><span ng-bind="item"></span></li>
    </ul>
    
    BIND ONCE
    <ul>
        <li ng-repeat='item in data'><span ng-bind-once="item"></span></li>
    </ul>
    
    <ul>
        <li ng-repeat='item in data'><span ng-bind-once="item"></span></li>
    </ul>
    
    <input ng-model="fff" />
</div>

CoffeeScript

app = angular.module 'app', []

app.controller 'Ctrl', ($scope) ->
  $scope.data = [
    'data 1'
    'data 2'
    'data 3'
    'data 4'
    'data 5'
    'data 6'
    'data 8'
    'data 28'
    'data 293'
  ]
  console.log($scope);
  
app.directive 'ngBindOnce', ->
  link: (scope, element, attr) ->
    element.addClass('ng-binding').data('$binding', attr.ngBindOnce)
    value = scope.$eval attr.ngBindOnce
    element.text value
  
angular.bootstrap document, ['app']