Do not bindonce ng-repeat, remove translateZ(0) optimisation - address dangling DOM nodes after ng-repeat finishes.

angular/angular.js#4490

Author: RohanM

app/assets/stylesheets/darkswarm/animations.sass

@@ -55,7 +55,7 @@
   100%
     opacity: 1
 
-@-webkit-keyframes spin 
+@-webkit-keyframes spin
   0%
     -webkit-transform: rotate(0deg)
     transform: rotate(0deg)
@@ -104,12 +104,10 @@
 
 
 .animate-repeat
-  -webkit-transform: translateZ(0)
-  transform: translateZ(0)
   &.ng-move, &.ng-enter, &.ng-leave
-    -webkit-transition: all 300ms linear 
-    transition: all 300ms linear 
-  
+    -webkit-transition: all 300ms linear
+    transition: all 300ms linear
+
   &.ng-leave
     opacity: 1
     &.ng-leave-active
@@ -178,7 +176,7 @@ product.animate-repeat
     overflow: hidden
     max-height: 0
     opacity: 0 !important
- 
+
   // &.ng-hide-add-active, &.ng-hide-remove-active
 
   &.ng-hide-add, &.ng-hide-remove
@@ -197,7 +195,7 @@ product.animate-repeat
 
   &.ng-hide
     opacity: 0 !important
- 
+
   // &.ng-hide-add-active, &.ng-hide-remove-active
 
   &.ng-hide-add, &.ng-hide-remove
@@ -206,8 +204,8 @@ product.animate-repeat
      it as hidden. */
     display: block !important
 
- 
- 
+
+
 
 
 @mixin csstrans
@@ -217,7 +215,3 @@ product.animate-repeat
   -o-transition: all 300ms ease
   transition: all 300ms ease
   -webkit-transform-style: preserve-3d
-
-
-
-

app/views/home/_fat.html.haml

@@ -1,21 +1,21 @@
-.row.active_table_row{"ng-show" => "open()", "ng-click" => "toggle($event)", "ng-class" => "{'open' : !ofn-i_032-closed-sign()}"}
+.row.active_table_row{"ng-show" => "open()", "ng-click" => "toggle($event)", "ng-class" => "{'open' : !ofn-i_032-closed-sign()}", bindonce: true}
   .columns.small-12.medium-6.large-5.fat
     %div{"bo-if" => "hub.taxons"}
       %label Shop for
       .trans-sentence
         %span.fat-taxons{"ng-repeat" => "taxon in hub.taxons"}
           %render-svg{path: "{{taxon.icon}}"}
-          %span{"bo-text" => "taxon.name"} 
+          %span{"bo-text" => "taxon.name"}
     %div.show-for-medium-up{"bo-if" => "hub.taxons.length==0"}
        
   .columns.small-12.medium-3.large-2.fat
     %div{"bo-if" => "hub.pickup || hub.delivery"}
       %label Delivery options
       %ul.small-block-grid-2.medium-block-grid-1.large-block-grid-1
-        %li.pickup{"bo-if" => "hub.pickup"} 
+        %li.pickup{"bo-if" => "hub.pickup"}
           %i.ofn-i_038-takeaway
           Pickup
-        %li.delivery{"bo-if" => "hub.delivery"} 
+        %li.delivery{"bo-if" => "hub.delivery"}
           %i.ofn-i_039-delivery
           Delivery
   .columns.small-12.medium-3.large-5.fat

app/views/home/_hubs.html.haml

@@ -8,13 +8,13 @@
   = render "shared/components/enterprise_search"
   = render "home/filters"
 
-  .row{bindonce: true}
+  .row
     .small-12.columns
       .name-matches{"ng-show" => "nameMatches.length > 0"}
         %h2 Did you mean?
         = render "home/hubs_table", enterprises: "nameMatches"
 
-      .distance-matches{"ng-show" => "nameMatches.length == 0 || distanceMatchesShown"}
+      .distance-matches{"ng-if" => "nameMatches.length == 0 || distanceMatchesShown"}
         %h2
           Closest to
           %span{"ng-show" => "nameMatches.length > 0"} {{ nameMatches[0].name }}...