creareapp typescript e angularStringhe e Template in TypeScript

Scopriamo i vantaggi offerti con la nuova notazione per l'inserimento di stringhe costituite da più righe, all'interno di variabili.

Ultimo aggiornamento: 3 giorni fa

Uno dei grossi problemi per chi progetta l'interfaccia utente di app ibride o web app, è rappresentata dal mescolare elementi del dom, quindi tag html, con elementi variabili legati a valori elaborati con JavaScript.

Un tipico esempio potrebbe essere quello qui sotto, in cui valorizzo una variabile JavaScript con del codice html rappresentativo della vista che l'utente dovrà visualizzare:

let articolo = "<div><h1>Titolo dell'articolo</h1>" +
"<p>Corpo dell'articolo: riga 1</p>" +
"<p>Corpo dell'articolo: riga 2</p>" +
"<a href=''>Continua</a></div>";

La nuova versione ECMAScript 6 di JavaScript, ha introdotto la possibilità di gestire queste sequenze di stringhe, che richiedono più righe, in modo molto più efficiente, sfruttando il carattere "accento grave" indicato dal simbolo grafico `, che in inglese viene chiamato "backticks".

let articolo = `
<div>
  <h1>Titolo dell'articolo</h1>
  <p>Corpo dell'articolo: riga 1</p>
  <p>Corpo dell'articolo: riga 2</p>
  <a href=''>Continua</a>
</div>  
`;

Questo carattere non è presente nella tastiera italiana, quindi è necessario usare la combinazioni di tasti ALT più contemporaneamente, il numero del tastierino 96, per inserirlo (ALT+96). Il vantaggio è evidente in quanto si ha una maggior leggibilità, maggior facilità di inserimento in quanto non si ha più interferenza con doppie virgolette del codice HTML e minor probabilità d' inserire errori.

Questa tecnica viene usata in Angular per creare quell...

Per continuare la lettura, registrati gratuitamente alla "CreareApp StartUniversity" oppure effettua il login.

Novità

Non farti scappare il nuovo libro: "Angular 100% Operativo", in offerta su Amazon. Più di 200 pagine, con tutto il percorso per creare una WebAPP e imparare Angular in un quarto del tempo. Prenotalo cliccando l'immagine qui sotto:

Corso Angular 4 100% Operativo

Ti è servito il breve tutorial? Condividilo ADESSO sui social! Grazie :-)

Categoria:

Voto 3.7/5 basato su 80 Recensioni
© 2013-2017 CreareAPP.com - Tutti i diritti riservati. Tutorial e WebCAMP per creare app in Android e iOS
NB: Tutti i marchi citati sono di proprietà dei rispettivi proprietari. Android is a trademark of Google Inc.