Questions tagged «angular-animations»

我使用angular-seed升级了Angular 4项目，现在得到错误 找到了合成属性@panelState。请在您的应用程序中包括“ BrowserAnimationsModule”或“ NoopAnimationsModule”。 我怎样才能解决这个问题？错误消息告诉我的是什么？

148 angular  typescript  angular-animations 

我希望div使用CSS从右角2滑入。 <div class="note" [ngClass]="{'transition':show}" *ngIf="show"> <p> Notes</p> </div> <button class="btn btn-default" (click)="toggle(show)">Toggle</button> 如果我仅使用[ngClass]来切换类并利用不透明性，则可以正常工作。但是li不想从一开始就渲染该元素，因此我先用ngIf“隐藏”了它，但是之后过渡就无法正常工作。 .transition{ -webkit-transition: opacity 1000ms ease-in-out,margin-left 500ms ease-in-out; -moz-transition: opacity 1000ms ease-in-out,margin-left 500ms ease-in-out; -ms-transition: opacity 1000ms ease-in-out,margin-left 500ms ease-in-out ; -o-transition: opacity 1000ms ease-in-out,margin-left 500ms ease-in-out; transition: opacity 1000ms ease-in-out,margin-left 500ms ease-in-out; margin-left: 1500px; width: 200px; opacity: …

121 css  angular  angular-animations 

我一直想知道为什么我应该在CSS动画上使用Angular动画。我发现人们在使用它们之前可能会考虑的几个方面： 性能 在第一步中，我发现这个问题只与物联网服务表现方面的交易。接受的答案对我来说并不令人满意，因为它指出应该尽可能使用CSS动画，以便可以应用诸如在单独线程中运行动画之类的优化。这似乎不是事实，因为Angular文档指出 角动画建立在标准Web动画API的基础上，并在支持该动画的浏览器上本地运行。 （强调我的） 而且，当我们查看Web动画API草案时，我们发现可以对Web动画应用与表中指定的CSS相同的优化。 尽管可以使用ECMAScript通过requestAnimationFrame [HTML]来执行动画，但是这种动画的行为与声明性动画不同，就其在CSS级联中的表示方式以及可能的性能优化（例如在单独的线程上执行动画）而言。使用Web动画编程界面，可以从脚本创建与声明性动画具有相同行为和性能特征的动画。 （再次强调我的） 除了IE等某些浏览器不支持Web动画外，是否有任何理由在Angular动画上使用CSS声明，反之亦然？我认为它们是可互换的性能。 更好地控制动画 这可能是Angular动画的一个参数，因为您可以暂停动画或将JS变量与其一起使用，等等，但是使用eg时也是如此。CSSanimation-play-state: pause或使用JS中指定的CSS变量，请参见说明文件。 现在，我看到在JS代码中设置CSS变量可能不方便，但是在使用Angular动画时也是如此。这些通常是在@Component animations字段中声明的，除了通过动画状态数据绑定属性之外，没有访问实例字段的权限（AnimationBuilder当然，如果您不通过动画创建动画，顺便说一句也不太方便或美观） 。 另一点是，使用Web Animations API可以检查，调试或测试动画，但是我看不到Angular动画怎么可能。如果是，请您告诉我如何？如果不是这样，那么我也确实没有发现为了控制而使用Angular动画而不是CSS动画有什么好处。 清洁代码 例如，我在这里阅读了一段，指出将动画与“常规”样式分开实际上是将行为和表现形式分开。确实是在样式表中声明动画来混合这些职责吗？我总是看到另一种方式，尤其是看@Component动画中的CSS规则时，让我感觉到在太多地方都有CSS声明。 那么Angular动画怎么样？ 从其他样式中提取动画只是一种便利实用程序，还是它带来了一些有价值的功能？ 使用Angular动画是否仅在特殊情况下才会奏效，还是团队选择沿袭这一惯例？ 我想在这里谈谈使用Angular动画的明显优势。谢谢大家提前！

69 javascript  css  angular  animation  angular-animations