Angular 6 正式发布
Angular 6 已经正式发布了！这个主要版本并不关注于底层的框架，更多地关注于工具链，以及使 Angular 在未来更容易快速推进。
作为发布的一部分，我们同步了主要的框架包 (@angular/core, @angular/common, @angular/compiler, etc), Angular CLI, 以及 Angular Material + CDK。现在全部都是作为 6.0.0 发布。我们理清了它们之间的兼容性。小的更新的补丁将会基于项目的需要发布。
可以通过每个项目的变更清单来查看全部的内容：framework, material+cdk, cli.
1. ng update
ng update 是一个新的 CLI 命令，用于分析 package.json 并使用其关于 Angular 的知识来更新您的应用。请查看升级手册来查看其行为。
不仅可以使用 ng update 来帮助您适配正确版本的依赖项，并保持依赖同步，而且第三方也可以使用 schematics来提供 update 脚本命令。如果您的某个依赖库提供了 ng update 语法，在其有大更新的时候，就可以自动更新您的代码了。
ng update 并不会替换您的包管理器，而是使用 npm 或者 yarn 在底层管理依赖，然后更新依赖，ng update 将对您的项目进行必要的转换。
例如，ng update @angular/core 将会更新所有的 Angular 框架包，比如：RxJS 和 TypeScript，并运行这些包中可用的 schematics 来保持最新。作为命令的一部分，我们将会自动安装 rxjs-compat 到您的应用中以平滑迁移。
我们期待更多的库和包在随后支持 ng update 语法，我们已经 听到一些企业库的团队在计划使用 ng update 来自动更新重要的变更升级，以减少开发时间。
学习更多关于如何使用 ng update, 开始学习如何创建您自己的 ng update 语法，可以参考 rxjs 的 package.json 的入口，它关联了 collection.json。
2. ng add
另一个新的 CLI 命令是 ng add，它可以使您添加新包变得更加容易。ng add 将使用您的包管理器来下载新的依赖项，并运行安装脚本（以 schematics 实现）。通过配置文件来更新项目。添加额外的依赖项（例如 polyfill 等），或者执行包特定的初始化代码。
可以在您的使用 ng new 创建的新项目上试一下下面的命令：
ng add @angular/pwa, 通过为您的应用添加 manifest 文件和 service worker 将其转换为 PWA 项目
ng add @ng-bootstrap/schematics, 将 ng-bootstrap 添加到项目中
ng add @angular/metarial, 安装与设置 Angular Metarial ，并使用 ng generate 添加新的启动组件。
ng add @clr/angular@next, 从 VMWare 安装和设置 Clarity。
ng add @angular/elements, 为 Angular elements 安装 document-register-element.js 和依赖项。
由于 ng add 基于 schematics 和 Npm ，我们希望库和社区支持我们构建一个 ng add 支持包的生态圈。
请查看 Angular Metarial 的 ng add schemetic，作为示例来帮助您开始创建您自己的 ng add。
3. Angular Elements
第一个版本的 Angular Elements 支持您在现有的 Angular 应用中通过注册 Angular Component 作为自定义元素。我们在 angular.io 内容管理系统中使用这种扩展能力，通过嵌入 HTML 来支持动态。这替换掉了手动启动 Angular 组件。
请查看注册 Angular Component 作为 custom element，或者学习更多的 Angular Elements.
已经有一个社区成员发布了 Angular Elements Quick Start, 我们非常建议您参考。
4. Angular Metarial + CDK component
最大的更新是增加了新的 tree 组件以显示层次结构，遵循 table 组件的模式，CDK 支持了核心 tree 指令，Angular Metarial 通过 Metarial Design 提供了一致的体验，我们最近提供了一个关于它的内容，可以参考（video, slide ）.新的 tree 组件有两种风格：（Metarial 风格）mat-tree 和未修饰的版本 cdk-tree
除了 tree 组件之外，我们还提供了 badge 和 bottom-sheet-components。徽章用于显示小的帮助信息。例如未读项目数量等等，Bottom-sheet 是移动设备专用的对话框，通常用于提供一系列动作的选项。
@angular/cdk/overlay 是 CDK 中非常有用的包，在新的 v6 版中，其包含新的定位逻辑，以在各种场景下帮助弹出。
5. Angular Metarial Starter Components
一旦您执行 ng add @angular/metarial 将 Metarial 添加到您的项目中，您将得到 3 个新的 starter 组件：
Metarial SideNav
您现在可以生成一个包含 app 名称的 toolbar 和边栏导航的起步组件。
执行
ng generate @angular/material:material-nav
将会生成这样的起步组件。
Metarial Dashboard
您可以生成一个包含动态表格的卡片列表 。
执行
ng generate @angular/material:material-dashboard
可以生成这样的组件。
Material Data Table
您可以生成支持排序、分页的预配置 datasource 的数据表组件。
执行
ng generate @angular/material:material-table
将会生成这样的组件。
在这里查看更多资料：Angular Material Schematics
6. CLI Workspaces
Angular CLI v6 现在支持包含多个项目的工作空间，比如多个应用或者库。CLI 项目现在将使用 angular.json 来替代 .angular-cli.json 进行配置和构建。
每个 CLI 可以有多个项目，每个项目有 target, 每个 target 有配置文件。
{
"projects": {
"my-project-name“： {
"projectType": "application",
"architect": {
"build": {
"configurations”: {
"production": {},
"demo": {},
"staging": {},
}
},
"serve": {},
"extrace-i18n": {},
"test": {},
}
},
"my-project-name-e2e": {}
}
}
更多信息请参考：新的配置文件。
7. 库的支持
被广泛请求的一个 CLI 特性现在支持了：创建和构建库。我很荣幸介绍它。
ng generate library
该命令将会在您的 CLI 工作空间创建一个库项目，并配置其测试和构建。
更多信息请参考：使用 Angular CLI 创建库
8. Tree Shakable 提供器
为使您的应用尺寸更小，我们从模块引用服务变成了服务引用模块。这使得我们可以仅仅打包模块中注入到代码中的服务。
以前
@NgModule({
...
providers: [ MyService ]
})
export class AppModule {}
其中，服务的定义
import { Injectable } from '@angular/core';
@Injectable()
export class MyService {
constructor() {}
}
以后的用法
不需要在模块中引用。
import { Injectable } from '@angular/core';@Injectable( {providedIn: 'root',})export class MyService { constructor() {}}
更多信息，参考依赖注入。
网友评论