2015-04-12 84 views
1

如何防止传送带启动完整摘要循环,并在每次滑动到新图像时重新运行我的收集过滤器。Angular Bootstrap传送带摘要

下面的plunker显示了我的意思,如果你点击一个项目并观看日志。 http://plnkr.co/edit/X062Xr90G807uqURqts9

<carousel disable-ng-animate ng-click="$event.stopPropagation();" interval="5000"> 
     <slide ng-repeat="photo in object.photos" active="photo.active"> 
      <img ng-src="{{photo.getUrl({'maxWidth': 350, 'maxHeight': 250})}}" style="margin:auto;"> 
     </slide> 
    </carousel> 

回答

1

如果您收藏都不会改变,你可以使用一次性绑定:

<div ng-repeat="item in ::collection | example" ng-click="setSelected(item)"> 

这里是updated plunker

但是,如果它不适合你,你必须进入carousel指令,看看你是否看到$apply
$apply将导致$rootScope.$digest,因此,filter将触发任何更改。

编辑

看好carousel.html(指令模板)后

你可以看到ng-mouseenter="pause()" ng-mouseleave="play()"

这是一个内置的角度指令和幕后角度使用$apply,所以我不能看到任何方式来避免对carousel指令进行全面摘要。

这里是角码:

forEach(
    'click dblclick mousedown mouseup mouseover mouseout mousemove mouseenter mouseleave keydown keyup keypress submit focus blur copy cut paste'.split(' '), 
    function(eventName) { 
    var directiveName = directiveNormalize('ng-' + eventName); 
    ngEventDirectives[directiveName] = ['$parse', '$rootScope', function($parse, $rootScope) { 
     return { 
     restrict: 'A', 
     compile: function($element, attr) { 
      // We expose the powerful $event object on the scope that provides access to the Window, 
      // etc. that isn't protected by the fast paths in $parse. We explicitly request better 
      // checks at the cost of speed since event handler expressions are not executed as 
      // frequently as regular change detection. 
      var fn = $parse(attr[directiveName], /* interceptorFn */ null, /* expensiveChecks */ true); 
      return function ngEventHandler(scope, element) { 
      element.on(eventName, function(event) { 
       var callback = function() { 
       fn(scope, {$event:event}); 
       }; 
       if (forceAsyncEvents[eventName] && $rootScope.$$phase) { 
       scope.$evalAsync(callback); 
       } else { 
       scope.$apply(callback); 
       } 
      }); 
      }; 
     } 
     }; 
    }]; 
    } 
); 
+0

不幸的是一次性的收集绑定也不会好,因为我需要集合中的添加/删除/编辑项目。我查看了Github https://github.com/angular-ui/bootstrap/blob/master/src/carousel/carousel.js上的轮播代码,但无法看到任何使用$ appy的代码。 –

+0

哦,这太烂了:(但至少它解释了为什么我的过滤器不断重新运行,非常感谢帮助。我想我会在这种情况下寻找一些其他的旋转木马解决方案:) –

+0

哦,事实证明,它是甚至这个问题太https://github.com/revolunet/angular-carousel –