Cela fait plusieurs mois que nous voyions les mises à jour sur Github : Angular 8 beta 14, … Et ça y est, enfin, la version 8.0.0 d’Angular est là ! Sortie il y a 4 jours, à l’heure où nous écrivons notre article.
Découvrons ensemble quelles nouveautés, et posons-nous cette question : Tout est à refaire, ou bien on peut garder ce que l’on connaît dans Angular ?
Tout d’abord, sachez qu’avec les navigateurs dernière génération, vous profiterez avec Angular 8 d’un bundle qui a été amélioré !
C’est un gros travail d’optimisation qui a été fait sur cette dernière version (sachez que la 8.1 est déjà en cours de travail …)
TypeScript a bien avancé ces derniers temps et Angular 8 prend en compte toutes les dernières nouveautés d’e TypeScript 3.4.
Ca fait presque deux ans qu’on entend parler d’Ivy. Ivy est censé révolutionner non pas ce que l’on va écrire, mais comment Angular va générer notre code et le traiter pour interagir avec le DOM.
Hélas, ils nous avaient annoncé une possible sortie pour la v8, on a un moyen d’essayer avec une option, mais pas prise en compte complète (ils nous parlent maintenant de la version 9).
Jusqu’à la version 7, lorsque vous voulez faire du lazy loading de module, vous faisiez ainsi :
|
1 |
<strong>loadChildren: './admin/my.module#AdminModule'</strong> |
Or, on avait un problème : TypeScript ne prenait plus rien en compte, vu que c’était une chaîne !
Avec la v8, tout change, on va pouvoir appeler un module en lazy loading ainsi :
|
1 |
loadChildren: () => import('./admin/my.module').then(m => m.AdminModule) |
Lors de l’utilisation de certains ViewChild, nous devions attendre le AfterViewInit, pour récupérer certains composant Html depuis notre composant.
Avec le mot clef static, si le composant peut être compris comme un composant static, vous pourrez l’appeler dès le ngOnInit !
|
1 2 |
Avant nous devions faire ainsi : <div #staticDiv>Contenu</div></code><code> |
|
1 |
Pour les prochaines versions : |
|
1 |
@ViewChild('staticDiv', { static: true }) staticDiv: ElementRef<HTMLDivElement>; |
Vous souhaitez mettre à jour votre projet, s’il est dans les dernières versions : pas de soucis ! Un simple ng update fera l’affaire 
Avec des versions plus anciennes, reprenez les étapes de mises à jour proposées par Angular