Angular 4.0.0 kullanıma hazır! Angular 4, semantik sürüm yapısına göre Angular'ın yeni ana sürümü olacak. Angular 4, pek çok uygulama için Angular 2 ile geri yönelik uyumlu olarak hazırlandı. Yani Angular.js den Angular 2 ye geçiş sırasında yaşanan yeniden yazma süreci bu güncellemede sözkonusu değil.

Angular 4 Neler Getiriyor?

Küçük ve Hızlı

Yeni versiyon, hazırlanan kodun daha küçük ve hızlı olmasını vaadediyor. Angular geliştiricileri buradaki çalışmanın tamamlanmadığını, fakat odaklandıkları noktanın bu olduğunu ve önümüzdeki aylarda bu konuda daha iyi noktaya geleceklerinin ipuçlarını veriyorlar.

View Engine

Angular 4 çekirdeğinde yapılan iyileştirmeler neticesinde oluşturulan kod pek çok durumda %60 a kadar küçültülebiliyor. Tasarımlar karmaşıklaştıkça bu oran yükseliyor. Dağıtım öncesi deneme süreçlerinde, geliştiricilerin çoğu uygulamalarının yüzlerce kilobyte küçüldüğünü doğruladılar.

Animation Package

Yapılan düzenleme ile animasyon paketi @angular/core paketinden çıkartılarak münferit bir paket haline getirildi. Böylece, eğer uygulamanızda animasyon öğesi kullanmıyorsanız, bu paketin uygulamanızı gereksiz yere şişirmesinin önüne geçmiş oluyorsunuz.

Ayrıca bu düzenleme, dokümantasyona daha kolay ulaşmanın ve otomatik tamamlamanın avantajlarını daha etkili kullanmanın önünü açacak. Yine de animasyon paketini eklemek isterseniz ana modül dosyasına ilgili modülü import edebiliyorsunuz.

import { BrowserAnimationsModule } from '@angular/platform-browser/animations';

Yeni Özellikler

Gelişmiş *ngIf ve *ngFor

Şablon giydirme yazım diziminde, size yardımcı olabilecek küçük değişiklikler yapıldı. Artık if/else yapısını kullanabilir, lokal değişkenlerle döngüler kurabilirsiniz.

<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

Geliştiricilerin Angular'ı bir sunucu üzerinde çalıştırmasına izin veren bir topluluk projesi olarak başlayan Angular Universal, Angular ekibi tarafında devralındı. Yeni sürüm, ekip içinden ya da dışından gelen pek çok geliştirmenin bir sonucu. Universal kodunun çoğunluğu @angular/platform-server olarak konumlandırıldı.

TypeScript 2.1 ve 2.2 Uyumluluğu

Angular, TypeScript'in en güncel sürümünü destekleyecek biçimde güncellendi. Bu da ngc'nin hızında iyileşme sağlarken uygulamalarda daha iyi tip kontrol imkanını beraberinde getirdi.

Şablonlar için Kaynak Haritası

Şablonlardan kaynaklanan bir hata oluştuğunda, Angular artık anlamlı bir kod haritası oluşturacak.

Angular 4 Yükseltme

Angular 4'e yükseltme işlemi neredeyse paketlerin update işlemi kadar kolay olacak. Sadece uygulamanızda eğer animasyon paketini kullanıyorsanız bununla ilgili import işlemini, önceki bölümde anlattığımız gibi yapmayı unutmamanız gerekiyor. Pek çok durum için bu kadarı yeterli olacak.

Linux / Mac

npm install @angular/{common,compiler,compiler-cli,core,forms,http,platform-browser,platform-browser-dynamic,platform-server,router,animations}@latest [email protected] --save 

Windows

npm install @angular/[email protected] @angular/[email protected] @angular/[email protected] @angular/[email protected] @angular/[email protected] @angular/[email protected] @angular/[email protected] @angular/[email protected] @angular/[email protected] @angular/[email protected] @angular/[email protected] [email protected] --save

Bunun ardından ng serve ya da npm start komutunu verdiğinizde herşey düzgün çalışıyor olmalı.