2018年5月4日,Angular6.0.0版正式发布,新版本主要关注底层框架和工具链,目的在于使其变得更小更快。下面就介绍下新版本的一些主要新特性,供大家参考。

ng update

ng update 是新增的一个cli命令。通过ng update不仅可以保持正确的版本依赖,而且能保持依赖关系的同步。第三方可以使用原理图提供更新脚本。如果您的某个依赖项提供了一个ng update原理图,那么他们可以在需要进行重大更改时自动更新代码!

ng add

ng add 也是新增的一个cli命令。通过ng add可以更加容易向项目中添加新功能(类似npm install )

Angular Material+CDK组件

angular6最大的补充是用于显示分层数据的新树组件。遵循数据表组件的模式,CDK包含核心树指令,而Angular Material则提供与顶层的Material Design样式相同的体验

Material

运行命令,添加Material

ng add @angular/material



一旦添加Material之后,你就可以生成三个新的入门组件

Material Sidenav

运行命令:

ng generate @angular/material:material-nav --name=my-nav //生成一个nav组件

Material Dashboard

运行命令:

ng generate @angular/material:material-dashboard --name=my-dashboard

Material Data Table

运行命令:

ng generate @angular/material:material-table --name=my-table



如果要了解更多有关Material的信息,请点击这里

CLI工作空间

CLI6.0版本现在支持包含多个项目的工作空间,如多个应用程序或库。CLI项目现在将使用angular.json而不是 .angular-cli.json用于构建和项目配置。

点击查看更多配置说明

库的支持

CLI最需要的功能之一是支持创建和构建库

ng generate library <name>

该命令将在CLI工作区内创建一个库项目,并对其进行配置以进行测试和构建。

ng generate library <name>

这个命令将在你的CKI工作空间创建一个库项目,并且自动添加配置信息到angular.json文件和tsconfig.json中。

点击查看更多关于CLI工作空间的信息

Providers的改变

为了使我们的程序变得轻量,Angular6将模块引入服务的模式,改成服务引入模块的模式。

6.0之前的版本服务注入
// app.module.ts
@NgModule({
...
providers: [MyService]
})
export class AppModule {} //my-service.ts
import { Injectable } from '@angular/core'; @Injectable()
export class MyService {
constructor() { }
}
6.0之后的版本服务注入

NgModule中不再需要引入

//my-service.ts

import { Injectable } from '@angular/core';

@Injectable({
providedIn: 'root',
})
export class MyService {
constructor() { }
}

Animations性能优化

新的Animations实现,不再需要 web animations polyfill。这也就意味着你可以从你的应用中移除 polyfill,这样可以减少大约47k的空间

RxJS v6

Angular已经更新使用了RxJS v6。RxJS作为一个独立的工程已经在几周前完成了V6的发布

长期支持 (LTS)

我们正在将我们的长期支持扩展到所有主要版本。

之前我们宣布只有v4和v6是LTS版本,但为了从一个主要版本更新到下一个主要版本更容易,并给更大的项目更多时间来规划更新,我们决定将延长对所有主要版本的长期支持从v4开始。

每个主要版本将支持18个月,大约6个月的积极开发,接下来是12个月的关键错误修正和安全补丁。

如何升级到6.0.0

按照引导对应用进行升级



更新通常遵循3个步骤,并将利用新ng update工具。

  1. 更新@ angular / cli
  2. 更新你的Angular框架包
  3. 更新其他依赖项

Ivy

Ivy将会是下一代渲染引擎,现在正在开发中。让我们拭目以待吧。

原文链接

Angular 6的新特性介绍的更多相关文章

  1. dubbox新特性介绍

    dubbx是当当网对原阿里dubbo2.x的升级,并且兼容原有的dubbox.其中升级了zookeeper和spring版本,并且支持restfull风格的远程调用. dubbox git地址:  h ...

  2. Hadoop3.0新特性介绍,比Spark快10倍的Hadoop3.0新特性

    Hadoop3.0新特性介绍,比Spark快10倍的Hadoop3.0新特性 Apache hadoop 项目组最新消息,hadoop3.x以后将会调整方案架构,将Mapreduce 基于内存+io+ ...

  3. jdk7和8的一些新特性介绍

    jdk7和8的一些新特性介绍 本文是我学习了解了jdk7和jdk8的一些新特性的一些资料,有兴趣的大家可以浏览下下面的内容. 官方文档:http://www.oracle.com/technetwor ...

  4. ArcGIS 10.3 for Desktop新特性介绍

    ArcGIS 10.3是一个完整公布的ArcGIS平台,它包含新的产品(ArcGIS Pro),针对10.2版本号产品进行了功能增强和稳定性的改进. ArcGIS 10.3 for Server新特性 ...

  5. Xcode9新特性介绍-中文篇

    背景: Xcode 9 新特性介绍: 1.官方原文介绍链接 2.Xcode9 be ta 2 官方下载链接 本文为官方介绍翻译而来,布局排版等都是按照官方布局来的. 与原文相比,排版上基本还是熟悉的配 ...

  6. php7函数,声明,返回值等新特性介绍

    使用 ... 运算符定义变长参数函数 (PHP 5 >= 5.6.0, PHP 7) 现在可以不依赖 func_get_args(), 使用 ... 运算符 来实现 变长参数函数. functi ...

  7. webpack 4.0.0-beta.0 新特性介绍

    webpack 可以看做是模块打包机.它做的事情是:分析你的项目结构,找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言(Scss,TypeScript等),并将其打包为合适的格式 ...

  8. MyBatis 3.5.2 新特性介绍

    1.MyBatis 最新版本 3.5.2 发布 MyBatis最新版本是:3.5.2,发布时间是:2019年7月15日 2.MyBatis 3.5.2 新特征介绍 我们知道,MyBatis 是支持定制 ...

  9. Java 11 新特性介绍

    Java 11 已于 2018 年 9 月 25 日正式发布,之前在Java 10 新特性介绍中介绍过,为了加快的版本迭代.跟进社区反馈,Java 的版本发布周期调整为每六个月一次——即每半年发布一个 ...

随机推荐

  1. OpenCV实现图像物体轮廓,前景背景,标记,并保存。

    #include <iostream> // for standard I/O #include <string> // for strings #include <io ...

  2. linux下如何查询未知库所依赖的包

    经常会遇到linux下安装软件时提示少文件,如何知道所缺少的文件属于哪个包?用什么命令查看? 例如:/lib/ld-linux.so.2: bad ELF interpreter: 没有那个文件或目录 ...

  3. linux终端用户登录流程

    终端可以通过连线,猫或网络(ssh,telnet,rlogin)和unix相连. 对于每个物理终端端口,都有一个getty监视,getty是由init程序启动的. getty收到用户名->调用l ...

  4. ubuntu安装最新的rails-4.2.0

    完全按照教程来,可是错误不断,还是边装边baidu吧! sudo gem install rails 安装了一大坨关联gem之后,终于好了.于是想小试一下身手,新建文件夹rails_test,cd进入 ...

  5. 01_Linux学习_基础知识

    学Linux就学命令行 === cd / 转到根目录,相对当前路径 cd dev 转到dev目录 whoami 查阅当前用户 pwd 查阅当前目录 ls 查阅当前目录下的目录和文件 === Linux ...

  6. iframe中 父页面和子页面查找元素的方法

    从父页面中查找iframe子页面中对象的方法:JS: document.getElementById('iframe').contentWindow //查找iframe加载的页面的window对象 ...

  7. 以太坊智能合约虚拟机(EVM)原理与实现

    以太坊 EVM原理与实现 以太坊底层通过EVM模块支持合约的执行与调用,调用时根据合约地址获取到代码,生成环境后载入到EVM中运行.通常智能合约的开发流程是用solidlity编写逻辑代码,再通过编译 ...

  8. AngularJS:何时应该使用Directive、Controller、Service?

    AngularJS:何时应该使用Directive.Controller.Service? (这篇文章你们一定要看,尤其初学的人,好吗亲?) 大漠穷秋 译 AngularJS是一款非常强大的前端MVC ...

  9. 前端到docker入门

    Docker的诞生 我们总是会遇到测试对开发说项目又不work了,开发总说:在我电脑上是ok的阿. 项目组加了新人,我们就需要教新人配置各种开发环境,每换一台机器就要配置一次,每来一个新人就要配置一次 ...

  10. 重装完的win10卡“请稍等”,然后电脑不断自动重启还是卡在“请稍等”?

    http://bbs.pcbeta.com/viewthread-1625778-1-1.html 说实话我用U盘安装win10遇到过几次这种情况,不管是win10正式版还是之前的个别win10测试版 ...