Question

我有一张表，而tr则由ng-repeat生成。当我过滤它们（在这种情况下更改页面）时，所有行都被替换为新行。但是，对于瞬间，我们会看到旧的过滤行（例如第3页）和新过滤的行（例如第4页）。这非常难看，因为它将我的设计搞砸了十分之一秒。

有没有办法让过渡无缝？我之前有ng-repeat动画（AngularJS 1.2.0RC1），但同样的事情发生了（虽然时间更长），我认为它可以通过禁用动画来修复。不幸的是，它没有解决它。

有任何想法吗？

[编辑]

这是我用于动画的CSS，在禁用它之前

.animate.ng-enter {
  -webkit-animation: enter_sequence 0.2s linear; /* Safari/Chrome */
  -moz-animation: enter_sequence 0.2s linear; /* Firefox */
  -o-animation: enter_sequence 0.2s linear; /* Opera */
  animation: enter_sequence 0.2s linear; /* IE10+ and Future Browsers */
}
@-webkit-keyframes enter_sequence {
  from { opacity:0;}
  to { opacity:1;}
}
@-moz-keyframes enter_sequence {
  from { opacity:0;}
  to { opacity:1;}
}
@-o-keyframes enter_sequence {
  from { opacity:0;}
  to { opacity:1;}
}
@keyframes enter_sequence {
  from { opacity:0; }
  to { opacity:1; }
}

.animate.ng-leave {
  -webkit-animation: leave_sequence 0.2s linear; /* Safari/Chrome */
  -moz-animation: leave_sequence 0.2s linear; /* Firefox */
  -o-animation: leave_sequence 0.2s linear; /* Opera */
  animation: leave_sequence 0.2s linear; /* IE10+ and Future Browsers */
}
@-webkit-keyframes leave_sequence {
  from { opacity:1; }
  to { opacity:0; }
}
@-moz-keyframes leave_sequence {
  from { opacity:1; }
  to { opacity:0; }
}
@-o-keyframes leave_sequence {
  from { opacity:1; }
  to { opacity:0;}
}
@keyframes leave_sequence {
  from { opacity:1; }
  to { opacity:0; }
}

Answer 1

您是否尝试过延迟css中的转换？适合我

在AngularJS中更平滑地过滤ng-repeat

1 个答案: