Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>Here is a repeat-done directive that calls a specified function when true. I have found that the called function must use $timeout with interval=0 before doing DOM manipulation, such as initializing tooltips on the rendered elements. jsFiddle: <a href="http://jsfiddle.net/tQw6w/">http://jsfiddle.net/tQw6w/</a></p> <p>In $scope.layoutDone, try commenting out the $timeout line and uncommenting the "NOT CORRECT!" line to see the difference in the tooltips.</p> <pre><code>&lt;ul&gt; &lt;li ng-repeat="feed in feedList" repeat-done="layoutDone()" ng-cloak&gt; &lt;a href="{{feed}}" title="view at {{feed | hostName}}" data-toggle="tooltip"&gt;{{feed | strip_http}}&lt;/a&gt; &lt;/li&gt; &lt;/ul&gt; </code></pre> <p>JS:</p> <pre><code>angular.module('Repeat_Demo', []) .directive('repeatDone', function() { return function(scope, element, attrs) { if (scope.$last) { // all are rendered scope.$eval(attrs.repeatDone); } } }) .filter('strip_http', function() { return function(str) { var http = "http://"; return (str.indexOf(http) == 0) ? str.substr(http.length) : str; } }) .filter('hostName', function() { return function(str) { var urlParser = document.createElement('a'); urlParser.href = str; return urlParser.hostname; } }) .controller('AppCtrl', function($scope, $timeout) { $scope.feedList = [ 'http://feeds.feedburner.com/TEDTalks_video', 'http://feeds.nationalgeographic.com/ng/photography/photo-of-the-day/', 'http://sfbay.craigslist.org/eng/index.rss', 'http://www.slate.com/blogs/trending.fulltext.all.10.rss', 'http://feeds.current.com/homepage/en_US.rss', 'http://feeds.current.com/items/popular.rss', 'http://www.nytimes.com/services/xml/rss/nyt/HomePage.xml' ]; $scope.layoutDone = function() { //$('a[data-toggle="tooltip"]').tooltip(); // NOT CORRECT! $timeout(function() { $('a[data-toggle="tooltip"]').tooltip(); }, 0); // wait... } }) </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    3. VO
      singulars
      1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload