Nessun risultato. Prova con un altro termine.
Guide
Notizie
Software
Tutorial

Angular 6: tutte le novità

Link copiato negli appunti

Alcuni giorni fa è stata ufficialmente rilasciato la versione 6 di Angular. Trattandosi di una major release le novità sono consistenti ma le principali non riguardano tanto il framework JavaScript vero e proprio quanto la CLI e il motore di rendering; pertanto il lavoro degli sviluppatori non dovrebbero subire un impatto rilevante da questa release.

Angular CLI

Per quanto riguarda la CLI è stato introdotto il comando ng update: questa istruzione analizza il file package.json e lo confronta con le versione disponibili per suggerire gli aggiornamenti necessari ai package usati all'interno dell'applicazione. Questo sistema permetterà di mantenere aggiornate e sincronizzate le dipendenze di un progetto e potrà essere usato per apportare modifiche importanti risparmiando tempo in fase di sviluppo.

Un altro nuovo comando è ng add che utilizzerà la gestione pacchetti per scaricare nuove dipendenze e richiamare uno script di installazione che può aggiornare il progetto con modifiche alla configurazione, integrare dipendenze aggiuntive (ad esempio polyfill). Alcuni esempi potrebbero essere:

  • ng add @angular/pwa per convertire l’applicazione in una PWA aggiungendo un manifest e un service worker.
  • ng add @ng-bootstrap/schematics per aggiungere ng-bootstrap.
  • ng add @angular/material per installare e configurare Angular Material.

Angular Elements

Angular Elements consente di utilizzare componenti Angular in applicazioni realizzate con altri framework. Dopo aver creato il component con Angular e generato il file ngfactory, possiamo "wrapparlo" all'interno di un elemento personalizzato con solo poche linee di codice.

Il risultato è un pacchetto JavaScript per il nostro component. Quindi tutto quello che si deve fare è importare questo script e usare il componente come qualsiasi altro elemento DOM. Per esempio potrebbe essere caricato all'interno di applicazioni basate su React, Vue e, volendo, anche jQuery.

Questa funzione potrebbe aiutare gli sviluppatori che utilizzano più framework a creare una libreria di componenti unificata. Angular Elements è anche un ottimo strumento per supportare l'architettura di micro front-end che consente ai team di sviluppo indipendenti di essere responsabili per un componente in esecuzione autonomamente sulla stessa pagina. Inoltre, consentirà alle aziende di convertire o aggiornare ad Angular 6 in modo incrementale, componente per componente, senza un investimento iniziale significativo.

Angular Material + CDK Components

Non si tratta di una novità vera e propria dato che era già disponibile con Angular 5, ma sono stati aggiunti nuovi component piuttosto interessanti a partire da un component ad albero per la visualizzazione dei dati gerarchici. Altre novità riguardano i badge e i bottom-sheet component. Inoltre aggiungendo material al nostro progetto abbiamo la possibilità di generare tre possibili setup base su cui lavorare:

  1. Material sidenav
  2. Material Dashboard
  3. Material Data Table

Infine bisogna ricordare che Angular 6 è stato aggiornato per poter usare la versione 6 RxJs e la versione 2.7 di TypeScript

Via Angular Blog

Ti consigliamo anche