【发布时间】:2018-11-16 03:34:39
【问题描述】:
Angular 5 和 Angular 6 有什么区别。如何将我们的应用程序从 Angular 5 更新到 Angular 6。
Angular 5 和 Angular 6 的主要区别是什么?
【问题讨论】:
Angular 5 和 Angular 6 有什么区别。如何将我们的应用程序从 Angular 5 更新到 Angular 6。
Angular 5 和 Angular 6 的主要区别是什么?
【问题讨论】:
Angular 6 变化:
1) Typescript 2.7+ 支持
2) 添加了 Angular 材质和 CDK 稳定版
3) 组件开发工具包 (CDK) - CDK 允许您使用 Angular Material 构建自己的 UI 组件库。
4) 改进的装饰器错误消息
5) 修复 Universal 的平台检测示例
6) Ivy Renderer - 这是一个新的向后兼容且主要关注的领域 - 提高了速度、减小了尺寸并增加了灵活性。
7) 添加 afterContentInit 和 afterContentChecked 进行渲染
8) 增加对 nativeElement 的支持
9) 为 ElementRef 添加了可选的泛型类型 该示例看起来像 - @ViewChild('your-element') yourElement:ElementRef;
10) Bazel 编译器 - Bazel 只重建必要的部分。
11) 添加测试注释
12) 为投影组件添加缺少的生命周期测试
13) Closure Compiler - Closure Compiler 始终生成更小的包。
14) 将 QueryPredicate 重命名为 LQuery,将 LQuery 重命名为 LQueries
15) Service Worker - Service Worker 是在 Web 浏览器中运行的脚本。它还管理应用程序的缓存。
16) 为 FormBuilder 的数组方法添加了多个验证器
17) 处理带和不带行边界的字符串 - 现在在模式验证器上处理带和不带行边界 (^ & $) 的字符串。以前,它适用于字符串而不是边界。
18) AbstractControl statusChanges - 以前的版本,当您调用“markAsPending”时不会发出事件,但现在当我们调用 AbstractControl markAsPending 时会发出“PENDING”事件。
19) NgModelChange 更新 - 现在在其控件上更新值和有效性后发出。以前,它是在更新之前发出的。
20) 允许 HttpInterceptors 注入 HttpClient – 以前,尝试直接注入 HttpClient 的拦截器会收到循环依赖错误,因为 HttpClient 是通过注入拦截器实例的工厂构造的。用户希望将 HttpClient 注入到拦截器中进行支持。
无论是 HttpClient 还是用户都必须专门处理循环依赖。此更改将责任转移到 HttpClient 本身。通过利用一个新类 HttpInterceptingHandler 在请求时延迟加载拦截器集,可以将 HttpClient 直接注入拦截器,因为构建 HttpClient 不再需要构造拦截器链。
21) 将 navigationSource 和 restoreState 添加到 NavigationStart - 目前,NavigationStart 无法知道导航是通过命令触发还是通过位置更改触发的。对于各种用例(例如,滚动位置恢复),应以不同方式处理这两个用例。此 PR 添加导航源字段和恢复的导航 ID(传递给由 URL 更改触发的导航)。
22) 为指令 def 添加类型和钩子
23) 启用最小 CLI render3 应用程序的大小跟踪
24) 添加规范视图查询
25) 语言服务——Typescript 的“resolveModuleName”的 2.6 版本开始要求传递的路径用“/”分隔,而不是能够处理“\”。
更多详情:Click Here
【讨论】:
您可以将 Angular 5 应用程序更新到 Angular v6, 参考这个网址http://www.talkingdotnet.com/upgrade-angular-5-app-angular-6-visual-studio-2017/
您还可以看到角度 5 和角度 6 之间的主要变化, https://dzone.com/articles/angular-6-release-vs-angular-5-new-features-and-im
【讨论】:
在 Angular 6 中,默认情况下,此装饰器配置有 "providedIn" 属性,该属性为服务创建提供者。在这种情况下,providedIn: 'root' 指定应该在根注入器中提供服务。
@Injectable({
providedIn: 'root'
})
export class ApiService{
//.......}
【讨论】:
从 Angular 5 到 6 有重大变化,前 10 项变化如下:-
详细解释请参考https://dzone.com/articles/top-10-features-of-angular-60
【讨论】: