Angular 13 的新功能：Angular 13 的主要新功能
介紹
考慮到過(guò)去發(fā)布的所有版本，Angular 13 是廣泛采用的打字稿風(fēng)格 Web 框架 Angular 最有組織的預(yù)先計(jì)劃升級(jí)之一。到 2021 年 9 月 24 日，Angular 的創(chuàng)建者已經(jīng)設(shè)計(jì)并發(fā)布了八個(gè)不同的 Angular 13 測(cè)試版。
關(guān)于 Angular 版本 13 的最新版本，我將確保包括所有值得注意的內(nèi)容，就像我們?cè)谥暗?/span>Angular 12、Angular 11和Angular 10博文中所做的那樣。如果您對(duì) Angular 13 中的新功能的鳥(niǎo)瞰圖感興趣，那么可以快速瀏覽一下 Angular 13 發(fā)行說(shuō)明、快速 Angular 核心更新和 Angular 13 的主要新功能。
Angular 13 的快速亮點(diǎn)
Angular 13 于 2021 年 11 月 3 日正式發(fā)布。
100% Ivy = 改進(jìn)的本地化 API 以動(dòng)態(tài)創(chuàng)建組件
RxJS- 支持 JavaScript 編程庫(kù)的 Reactive Extensions >=7.4
不支持IE11
min、max 和 minLengt 等驗(yàn)證器可以動(dòng)態(tài)啟用或禁用
構(gòu)建緩存顯著提高 70%
更容易的指令禁用
錯(cuò)誤消息已得到改進(jìn)
移除 View Engine 支持
改進(jìn)的 APF – 更快的執(zhí)行
Angular TestBed 改進(jìn)
打字稿 >=4.4.x
Angular 13 特性
這是在將應(yīng)用程序升級(jí)到 Angular 13 之前應(yīng)該了解的最新 Angular 13 新功能。
(1) 100% 常春藤
Angular 開(kāi)發(fā)服務(wù)的創(chuàng)建者和提供者希望能夠改進(jìn)動(dòng)態(tài)組件的質(zhì)量?？紤]到這一點(diǎn)，API 得到了簡(jiǎn)化。新的 API使用ViewContainerRef.createComponent刪除了ComponentFactoryResolver，而不生成關(guān)聯(lián)的工廠。
以下是使用以前版本的 Angular 創(chuàng)建組件的方式。
@Directive({ … }) 導(dǎo)出類 MyDirective { 構(gòu)造函數(shù)（私有 viewContainerRef：ViewContainerRef， 私有組件工廠解析器： 組件工廠解析器）{} 創(chuàng)建我的組件（）{ const componentFactory = this.componentFactoryResolver。 resolveComponentFactory（我的組件）； this.viewContainerRef.createComponent(componentFactory); } }
以下是新的 API 代碼如何變成的。
@Directive({ … }) 導(dǎo)出類 MyDirective { 構(gòu)造函數(shù)（私有 viewContainerRef：ViewContainerRef）{} 創(chuàng)建我的組件（）{ this.viewContainerRef.createComponent(MyComponent); } }
（2）RxJS 7.4
Angular v13 更新包括 RXJS 到版本 7 之前的所有版本。使用 CLI 創(chuàng)建的新應(yīng)用程序?qū)⒛J(rèn)為 RxJS 7.4。如果您在現(xiàn)有應(yīng)用程序中使用 RxJS 6，則必須手動(dòng)運(yùn)行命令 npm install rxjs@7.4以獲取最新更新。
(3) 不再支持 Internet Explorer
Angular 13 不支持 Internet Explorer。如果您打算雇用 Angular 開(kāi)發(fā)人員，那么您不應(yīng)該期望從 IE11 中創(chuàng)建任何東西。
您是否正在尋找?guī)褪謥?lái)充實(shí)您的 Angular 項(xiàng)目但擔(dān)心成本？
查看我們的詳細(xì)指南，該指南涵蓋了Angular 開(kāi)發(fā)人員成本的各個(gè)方面，可幫助您聘請(qǐng)合適的人才而不用掏腰包。
(4) Angular 包格式 (APF) 的變化
Angular 包格式——APF 簡(jiǎn)化并現(xiàn)代化了舊的輸出格式，包括 View Engine 元數(shù)據(jù)。APF 的更新版本不需要使用ngcc. 由于庫(kù)中的這些變化，開(kāi)發(fā)人員可以期待更快的執(zhí)行速度和更精簡(jiǎn)的包輸出。
(5) TestBed Teardown 現(xiàn)在默認(rèn)
v12 中添加了 TestBed 配置，方便拆卸測(cè)試模塊和環(huán)境。TestBed 拆解現(xiàn)在是默認(rèn)功能，但您可以隨意禁用和配置它。
(6) 文檔改進(jìn)
$localize 是一個(gè)穩(wěn)定的 API。$localize 用于為內(nèi)置國(guó)際化 (i18n) 和標(biāo)記消息創(chuàng)建更有效的方法以在模板和代碼中進(jìn)行翻譯！查看這些$localize 文檔，了解如何在 Angular 中更輕松地學(xué)習(xí)和入門(mén)！
(7) 對(duì) Adobe 字體的內(nèi)聯(lián)支持
就像 Google fonts- V11 一樣，您也可以內(nèi)聯(lián) Adobe 字體。為了您的參考，我附上了 Mark Thompson 的視頻截圖以加快字體內(nèi)聯(lián)的性能。
Mark 的字體內(nèi)聯(lián)視頻教程的屏幕截圖
(8) Angular Material 可訪問(wèn)性改進(jìn)
基于 MDC 的 Angular Material 組件具有可訪問(wèn)性改進(jìn)。Emma Twersky 在這篇博文中詳細(xì)介紹了如何改進(jìn) Angular Component 的可訪問(wèn)性。
(9) 打字稿 4.4
TypeScript 4.4 得到全面支持，TS 4.4 的一些重要亮點(diǎn)包括：
判別式和條件的控制流分析
模板字符串模式索引簽名
默認(rèn)捕獲變量 (–useUnknownInCatchVariables)
可選屬性 (–exactOptionalPropertyTypes)
Angular v13 性能改進(jìn)
最新版本的 Angular 13 帶來(lái)了多項(xiàng)性能改進(jìn)：
現(xiàn)在默認(rèn)啟用選擇加入功能
Angular CLI 的改進(jìn)。新 v13 項(xiàng)目默認(rèn)使用持久構(gòu)建緩存的構(gòu)建速度提高了 68%
改進(jìn)了構(gòu)建性能以優(yōu)化捆綁包和全局腳本。
增量構(gòu)建性能不包含任何 Angular 特征，如組件、指令、管道、可注入、NgModule 裝飾器。
Angular v13 顯著變化；
所有 Angular 包都將 Node.js 16 添加到所有節(jié)點(diǎn)引擎中。
ViewContainerRef.createComponent 直接支持組件類型。接受 ComponentFactory 的現(xiàn)有簽名現(xiàn)已棄用。
Ivy 不再需要來(lái)自@angular/platform-server 的 renderModuleFactory。相反，可以使用 renderModule。
Angular 語(yǔ)言支持模板中聯(lián)合類型的自動(dòng)完成。
您可能還想知道
Angular 14 有什么新功能？
包起來(lái)
Angular 團(tuán)隊(duì)確保每六個(gè)月對(duì)前一個(gè)版本進(jìn)行一次新版本更新。Angular 12 于 5 月 12 日推出?，F(xiàn)在 Angular v13 現(xiàn)已推出，具有各種功能和更新。使用 IVY 的強(qiáng)大功能試用 Angular 13。如果您使用的是舊版本，是時(shí)候從 Angular 12 更新到 Angular 13 以構(gòu)建支持現(xiàn)代 Web 標(biāo)準(zhǔn)的出色應(yīng)用程序。
您還可以利用我們的Angular 升級(jí)服務(wù)將您現(xiàn)有的項(xiàng)目更新到最新版本，同時(shí)最大限度地減少中斷。