Javascript AngularJS：隔离单个指令的范围，以避免在应用程序的其他部分进行更新

很抱歉标题混乱，但我无法在短文本中更好地说明，我将尝试在深入描述中更加明确

我用angularJS创建了一个web应用程序。其中一个要求是，在指令中页面的一部分中，页面需要有3个不同的DOM，每个DOM的编号通常每秒钟更新150次

我采用的第一个解决方案是只显示指令的控制器：

angular.module('myModule')
    .controller('myController', function($scope, $interval) {
        $scope.items = [{
            name: 'item 1',
            speed: 100
        },{
            name: 'item 2',
            speed: 150
        },{
            name: 'item 3',
            speed: 300
        }];

        angular.forEach($scope.items, function (item) {
            item.count = 1;
            $interval(function increment () {
                item.count++;
            }, item.speed);
        });
    });

当然，在模板中：

<ul>
    <li ng-repeat="item in items">
        {{item.count}}
    </li>
</ul>

它工作得很好，但是它为整个页面应用程序带来了一个问题，因为它有几个角度指令，比如ng show/ng hide/ng if/ng bind/ng class和其他调用函数的指令，并且这些函数在angularJS的双重绑定中被多次调用

指令中报告的控制器每次都会更新范围和角度检查，以评估与ng-相关的功能。每一个ng函数每秒调用550次。 这个场景是一个问题，因为我的应用程序也必须在智能手机上运行，这个解决方案将消耗大量电池，因为它需要执行大量无用的js功能

我有一个解决方案，通过使用纯js和DOM引用来更新这个数字，但我希望将整个js代码保存在angularJS中

有人能用angularJS建议一种方法吗？也许是一种隔离范围的方法

干杯