在Angular 7中，安装Angular Material并实现拖放功能
以下是中文的原生释义（视频讲解）链接：https://youtu.be/i8roYTAAj-U
视频解说（英文）
视频说明（英文）
英文视频解说
必要的环境
如果您的系统尚未安装Angular7，请预先安装，因为它是必需的。
生成项目
首先用一个适当的名称创建一个新项目。
我会输入ng new ng7Material01。
ng7Material01是项目名，该名称是可选的。
首先，有一个关于是否添加路由功能的询问。
在这里，我们将y确定为一个变量。
在接下来，你可以选择样式表格式。这里我们选择SCSS。
然后项目的生成会开始。
这个过程需要一些时间。
一旦项目创建完毕，请前往项目目录。
然后，输入”code .”，启动Visual Studio Code。
安装Angular Material
当VS Code启动后，您可以使用Control + @键来打开终端窗口。
输入 “ng add @angular/material”，然后安装 Angular Material。
因此我们收到了有关颜色组合主题的查询，所以我们在这里选择了标准的靛蓝-粉色组合。
接下来，询问是否要设置HammerJS，并输入“y”。
由于最后有关是否使用动画的询问，请输入y。
然后，将进行Package.json文件等的重新编辑，并完成安装。
检查Angular Material的新功能（拖放功能）。
我想在这里尝试一下Angular Material的新功能。
首先，打开浏览器，访问Angular Material Schematics的页面：https://material.angular.io/guide/schematics。
并显示拖放原理图部分，以及该命令行。
在本地用中文复述下面这句话，只需要一个选项：使用 ng generate @angular/cdk:drag-drop 。
复制。
回到VS Code并将其粘贴到命令行中。
组件名称可以根据个人喜好进行设置。
在这里，我们将组件命名为mydragdrop。
这个过程很快就结束了。
查看源码后，可以看到新生成了一个名为mydragdrop的目录。
接下来打开此目录中的mydragdrop.component.ts文件，并复制选择器名称。
在这里，它被命名为app-mydragdrop。
接下来，打开app.component.html文件，并将标签粘贴到最后一行。
进一步把默认的HTML文本全部注释掉。
我要保存这个文件。
接下来，在终端窗口中输入”ng s -o”命令，启动本地服务器并打开浏览器。
将显示一个包含两列的列表，尝试拖放每个项目。
回到 VS Code，在键入 Control + C 并按下回车键后停止本地服务器。
我确认了在Angular 7中运行Angular Material。
请将以下内容用中文进行翻译，只需要一个选项：
– “I am going to the store to buy some groceries.”
请参考
-
- “Schematics”,
-
- https://material.angular.io/guide/schematics
-
- “Angular Update Guide”,
-
- https://update.angular.io/
-
- “Version 7 of Angular — CLI Prompts, Virtual Scroll, Drag and Drop and more”,
-
- https://blog.angular.io/version-7-of-angular-cli-prompts-virtual-scroll-drag-and-drop-and-more-c594e22e7b8c
-
- “Angular5,Angular6,Angular7 Custom Library: Step-by-step guide”,
-
- https://www.udemy.com/angular5-custom-library-the-definitive-step-by-step-guide/
-
- “Angular5,Angular6,Angular7用 カスタムライブラリの作成: 完全ステップ・バイ・ステップ・ガイド”,
- https://www.udemy.com/angular5-l/
