Angular + Animate.css 的五个简单步骤

Angular + Animate.css 的五个简单步骤

循序渐进的 Angular 教程

Animate.css是一个跨浏览器
的 CSS 动画库，使用起来非常简单。

在这篇文章中，我将向您展示如何
仅用五个步骤配置 Animate.css 以在 Angular 中使用。

步骤 1：初始化你的项目

如果你正在考虑在 Angular 项目中使用 Animate.css，那么你
可能已经有一个初始化的项目了。但是，在本教程中，我们将
从头开始创建一个项目。

步骤2.安装Animate.css

安装animate.css。

步骤3.包含Animate.css

有几种方法可以将 Animate.css 包含在我们的项目中：

• 打开angular.json样式数组并插入一个新条目：

• 打开styles.css并在文件中插入新条目：

步骤4.添加动画CSS类

打开模板的组件并将动画 CSS 类添加到任何
HTML 元素中：

步骤5.运行您的应用程序！

运行你的应用程序：

更多、更多、更多……

• 动画.css

这篇文章的GitHub分支是
https://github.com/Caballerog/angular-animate.css

最初发布于https://carloscaballero.io