Angular 4.0.0 強勢釋出，全向後相容

白菜不如香菜好發表於2019-02-19
Angular

經歷了6個RC版本之後，今天Angular釋出了4.0.0版本，這次釋出是主版本的更新（遵循採用語義版本），並且在大多數情況下，Angular4.0版本是向後相容Angular2.0的。

那麼，這次Angular4版本主要更新了什麼呢？

  • 體積更小，速度更快
    Angular應用程式變得更小更快，並且在未來幾個月將進一步改進框架。
  • 更好的模板引擎
    改進了AoT，將生成的程式碼的大小減少約60％。如果模板越複雜，那麼優化的程式碼也會越多。（譯者注：當然，這對於使用者來說，完全是透明的，public api 沒有發生變化。）
  • 動畫模組改進
    將動畫從@angular/core中分離開來，區分核心模組與動畫模組，精簡核心模組體積。

再來看看Angular4給我們帶來了哪些新的特性。

  • 增強 ngIf 和 ngFor 語法
    模板繫結語法進行了幾個有用的更改。現在可以使用if / else樣式語法，並分配區域性變數，例如在展開observable時。

    <div *ngIf="userList | async as users; else loading">
    <user-profile *ngFor="let user of users; count as count" [user]="user">
    </user-profile>
   <div>{{count}} total users</div>
</div>
<ng-template #loading>Loading...</ng-template>複製程式碼

  • 服務端渲染（Angular Universal）
    原先的Angular Universal是社群人員維護的，後被angular官方採用。目前在4.0.0版本中，將大部分的程式碼整合在@angular/platform-server模組中。為大家帶來更好的服務端渲染體驗，更簡單Api呼叫。請參見基於Angular4的服務端渲染demo： github.com/z827101859/… 。之後，官方會為大家帶來更好更全面的例子。

  • TypeScript 2.1 和 2.2 的相容
    Angular已更新為更新版本的TypeScript，提高了ngc的速度，並且有更好的型別檢查機制。
  • 模板的Source Maps
    當模板中的某些內容發生錯誤時，Angular會生成源對映，從而為原始模板提供有意義的上下文。

更多內容，請參見Angular官方原文：
angularjs.blogspot.hk/2017/03/ang…

最後，給想要學習Angular的同學一個Angular4的模板專案，專案結合webpack進行打包，包含了當前Angular框架中的許多新特性，喜歡的同學不妨開始從這裡學習：github.com/ntesmail/an…
  1. git clone git@github.com:ntesmail/angular-webpack-template.git
  2. npm install （由於你懂的原因，這一步你可能會安裝失敗，這時候大家只能翻牆咯）
  3. npm run start

轉載請申明@sweetyx

相關文章