Angular 7 是一款现代的前端框架，它以 TypeScript 为基础语言，提供了许多用于构建复杂应用程序的工具和组件。如果你想快速掌握 Angular 7，那么本文为你提供了以下几个步骤。
步骤一：安装 Angular CLI
Angular CLI 全称 Angular Command Line Interface，它是 Angular 应用程序开发的脚手架工具。安装 Angular CLI 的最简单方法是使用 npm，打开终端窗口并运行以下命令：
--- ------- -- ------------
wait
步骤二：创建新的 Angular 7 项目
打开终端，使用 ng new 命令创建一个新的 Angular 7 项目，例如：
-- --- ------------------
执行完命令后，Angular CLI 会自动安装所需的依赖项，这需要一些时间，取决于您的网络速度。
步骤三：运行 Angular 7 应用程序
在项目目录中使用 cd 命令切换到新创建的应用程序的目录，然后使用 ng serve 命令启动应用程序，例如：
-- ------------------ -- -----
wait
步骤四：学习 Angular 7 的基本概念
了解 Angular 7 的基本概念对于您开发任何规模的应用程序都非常重要。以下是一些基本的概念：
模块
Angular 7 中的模块是用来组织代码和应用程序的功能的容器。每个 Angular 应用程序都至少有一个模块，称为根模块。您可以使用 @NgModule 装饰器来创建新的模块，例如：
------ - -------- - ---- ---------------- ------ - ------------- - ---- ---------------------------- ------ - ------------ - ---- ------------------ ----------- -------- ---------------- ------------- --------------- ---------- -------------- -- ------ ----- --------- - -
组件
Angular 7 中的组件用于定义应用程序的用户界面。每个组件都有一个模板，用于定义它的 HTML、CSS 和行为。您可以使用 @Component 装饰器来创建新的组件，例如：
------ - --------- - ---- ---------------- ------------ --------- ------------------ --------- ---------- ------------ -- ------ ----- ------------------- - -
服务
Angular 7 中的服务用于共享功能和数据。服务可以被注入到组件和其他服务中，以提供功能和数据。您可以使用 @Injectable 装饰器来创建新的服务，例如：
------ - ---------- - ---- ---------------- ------------- ----------- ------ -- ------ ----- ----------- - -
指令
Angular 7 中的指令用于扩展 HTML 模板的行为。指令可以用于添加、修改或删除 HTML 元素的属性、样式或结构。有三种类型的指令：组件、属性指令和结构指令。您可以使用 @Directive 或 @Component 装饰器来创建新的指令或组件，例如：
------ - ---------- ---------- - ---- ----------------
------------
--------- ----------------
--
------ ----- ------------------ -
--------------- ----------- -
-------------------------------------- - ---------
-
-步骤五：练习 Angular 7
创建一个新的组件，并向模板添加一些 HTML 和 CSS。您可以使用 Angular 7 的 CLI 来生成新的组件、服务和指令，例如：
-- -------- --------- ---------------- -- -------- ------- -------------- -- -------- --------- ---------------- -- -------- ---- -----------
总结
本文介绍了如何快速入门 Angular 7。您可以按照上述步骤安装 Angular CLI，创建新的 Angular 7 项目，并学习 Angular 7 的基本概念。最后，您可以通过创建新的组件并向其添加一些 HTML 和 CSS 来练习 Angular 7。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/649b277d48841e9894809dc6