Angular小博客
分享让你更聪明
Angular 6.0.0 版本已发布！这是一个主要版本，较少关注底层框架，更多关注工具链，并让未来更容易快速使用 Angular。
作为此版本的一部分，我们正在同步框架包（ @angular/core 、 @angular/common 、 @angular/compiler等）、Angular CLI 和 Angular Material + CDK 的主要版本。今天所有版本均以 6.0.0 版本发布。我们进行此更改是为了澄清交叉兼容性。这些项目的次要版本和补丁版本将根据项目的需要发布。
请参阅我们的变更日志中的完整变更列表： framework 、 material+cdk 、 cli 。
ng update <package>是一个新的 CLI 命令，它分析您的package.json并使用其 Angular 知识来推荐应用程序的更新。要查看其实际效果，请查看我们的更新指南。
ng update不仅可以帮助您采用正确版本的依赖项并保持依赖项同步，而且第 3 方可以使用原理图提供更新脚本。如果您的某个依赖项提供了ng update原理图，那么它们可以在需要进行重大更改时自动更新您的代码！
ng update不会取代你的包管理器，而是在底层使用 npm 或yarn 来管理依赖项。除了更新依赖项和对等依赖项之外， ng update还会将所需的转换应用于您的项目。
例如，命令ng update @angular/core将更新所有 Angular 框架包以及 RxJS 和 TypeScript，并将运行这些包上可用的任何原理图以使您保持最新状态。作为此命令的一部分，我们将自动将rxjs-compat安装到您的应用程序中，以使 RxJS v6 的采用更加顺利。
我们预计在未来几个月内会看到更多的库和包添加ng update原理图，并且已经收到企业组件库团队的消息，他们计划使用ng update以自动化的方式推动重要更改，以节省开发人员的时间。
了解有关ng update命令如何工作的更多信息。要开始创建自己的ng update原理图，请查看rxjs 的package.json及其关联的collection.json中的条目。
另一个新的 CLI 命令ng add <package>可以轻松地向项目添加新功能。 ng add将使用您的包管理器下载新的依赖项并调用安装脚本（作为原理图实现），该脚本可以通过配置更改来更新您的项目、添加其他依赖项（例如，polyfills）或脚手架包特定的初始化代码。
在您的ng new应用程序上尝试以下一些操作：
ng add @angular/pwa — 通过添加应用程序清单和服务工作线程将您的应用程序转变为 PWAng add @ng-bootstrap/schematics — 将ng-bootstrap添加到您的应用程序中ng add @angular/material — 安装和设置 Angular Material 和主题，并将新的入门组件注册到ng generate中ng add @clr/angular — 从 VMWare 安装和设置 Clarityng add @angular/elements — 添加 Angular Elements 所需的document-register-element.js polyfill 和依赖项（见下文）因为ng add是建立在原理图和 npm 注册表之上的，所以我们希望库和社区能够帮助我们构建一个丰富的ng add支持包生态系统。
查看Angular Material 的 ng-add 原理图示例，帮助您开始构建自己的 ng-add 原理图。
Angular Elements 的第一个版本的重点是允许您通过将 Angular 组件注册为自定义元素来在现有 Angular 应用程序中引导它们。我们在 angular.io 中广泛使用它作为内容管理系统的一部分，以允许通过嵌入式 HTML 动态引导功能。这取代了手动引导在静态 html 内容中找到的 Angular 组件的需要。
查看将组件注册为自定义元素的示例或了解有关 Angular Elements 的更多信息。
我们的一位社区成员还制作了我们强烈推荐的Angular Elements 快速入门视频。
最大的新增功能是用于显示分层数据的新树组件。遵循数据表组件的模式，CDK 包含核心树指令，Angular Material 提供与顶部的 Material Design 样式相同的体验。我们最近就该组件进行了一次演讲，因此请查看该内容以获取更多信息（视频、幻灯片）。这些新的树组件有样式版本（Material 的mat-tree ）和无样式版本（CDK 的cdk-tree ）。
除了树之外，我们还有新的徽章和底板组件。徽章有助于显示少量有用信息，例如未读项目数。底页是一种特殊类型的以移动设备为中心的对话框，从视口底部出现，通常用于呈现操作后的选项列表。
@angular/cdk/overlay包是当今 CDK 中最强大的基础设施之一。随着 v6 的发布，该软件包现在包含新的定位逻辑，有助于使弹出窗口在所有情况下智能地保留在屏幕上。
一旦你跑完ng add @angular/material要向现有应用程序添加材料，您还可以生成 3 个新的入门组件。
您现在可以生成一个入门组件，其中包括带有应用程序名称和侧面导航的工具栏。该组件基于断点进行响应。
// 执行
ng generate @angular/material:material-nav --name=my-nav这将创建这个启动组件：
您现在可以生成包含动态卡片网格列表的入门仪表板组件。
ng generate @angular/material:material-dashboard --name=my-dashboard这将创建这个启动组件：
您可以生成一个初始数据表组件，该组件预先配置了用于排序和分页的datasource 。
// 执行
ng generate @angular/material:material-table --name=my-table这将创建这个启动组件：
CLI v6 现在支持包含多个项目的工作区，例如多个应用程序或库。 CLI 项目现在将使用angular.json而不是.angular-cli.json进行构建和项目配置。
每个 CLI 工作区都有项目，每个项目都有目标，每个目标都可以有配置。
// angular.json
{
"projects": {
"my-project-name": {
"projectType": "application",
"architect": {
"build": {
"configurations": {
"production": {},
"demo": {},
"staging": {},
}
},
"serve": {},
"extract-i18n": {},
"test": {},
}
},
"my-project-name-e2e": {}
},
}我们的 CLI 最受欢迎的功能之一是支持创建和构建库，我们很自豪地介绍：
ng generate library <name>
此命令将在 CLI 工作区中创建一个库项目，并对其进行配置以进行测试和构建。
为了使您的应用程序更小，我们已从引用服务的模块转移到引用模块的服务。这允许我们仅将服务捆绑到注入服务的模块中的代码库中。
之前的代码：
// app.module.ts
@NgModule({
...
providers: [MyService]
})
export class AppModule {}
//my-service.ts
import { Injectable } from '@angular/core';
@Injectable()
export class MyService {
constructor() { }
}现在的代码：
我们的 NgModule 中不需要引用。
// my-service.ts
import { Injectable } from '@angular/core';
@Injectable({
providedIn: 'root',
})
export class MyService {
constructor() { }
}我们更新了动画的实现，不再需要网页动画 polyfill 。这意味着您可以从应用程序中删除此 Polyfill，并节省大约 47KB 的包大小，同时提高 Safari 中的动画性能。
Angular 已更新为使用 RxJS v6。 RxJS 是一个独立项目，几周前发布了 v6。 RxJS v6 带来了一些重大变化，以及一个向后兼容包rxjs-compat ，可以让您的应用程序正常运行。
RxJS 已被重新安排，使其更加可摇树，确保只有您使用的 RxJS 片段包含在您的生产包中。
如果您使用ng update ，您的应用程序应该继续工作，但您可以了解有关 5.5 到 6.0 迁移的更多信息。
之前我们宣布只有 v4 和 v6 是 LTS 版本，但为了使从一个主要版本更新到下一个版本更容易，并给更大的项目更多的时间来计划更新，我们决定将长期支持扩展到所有主要版本从 v4 开始。
每个主要版本将支持 18 个月，其中大约 6 个月的积极开发，随后是 12 个月的关键错误修复和安全补丁。
详细了解Angular 如何版本和发布.
请访问update.angular.io以获取有关更新应用程序的信息和指南。
更新一般分为3步，并且会利用新的ng update工具。
让开发人员轻松了解最新版本对我们来说非常重要，因此请在评论中告诉我们您对此版本的看法！
在 ng-conf 上，我们提到了一项名为 Ivy 的新计划——我们的下一代渲染管道。 Ivy 目前正在积极开发中，不属于 6.0 版本的一部分。一旦 Ivy 在未来几个月内准备就绪，我们将立即宣布选择加入预览版。请关注此博客以获取最新信息。
文章来源地址：https://blog.angular.dev/version-6-of-angular-now-available-cc56b0efa7a4