kątowy 2 i szablon: niezakłócony ciąg literal.at wiersz 6 kol. 24

Question

W poniższym kodzie, z jakiegoś powodu po wprowadzeniu nowej linii po szablonie pojawia się błąd. Wszystkie moje tagi muszą znajdować się w jednej linii '<h1>...<h2> etc.' - W momencie, gdy uderzyłem , wpisz po szablonie: 'wpisz powoduje to błąd.

niezakończony ciąg literal.at linii 6 kol 24 TS Błąd nieruchomości przypisanie linii expected.at 7 kol 10 TS Error '' expected.at linia 7 col 25 TS Error Line Type expected.at 7 kol 27 TS błąd niezakończona wyrażenie regularne literal.at linii 7 col 28 TS Error '' expected.at linii 8 kol 1

import {Component} from 'angular2/core'; 

@Component({ 
    selector: 'ponyracer-app', 
    template: 
    '<h1>PonyRacer</h1> 
    <h2>{{numberOfUsers}}</h2>' 
}) 
export class PonyRacerApp { 

    numberOfUsers: number = 146; 
} 

Answer 1

Stosować ` (backsticks) nie ' (jedno - lub dwu - cytaty), aby zadeklarować ciąg szablonu:

import {Component} from 'angular2/core'; 

@Component({ 
    selector: 'ponyracer-app', 
    template: 
    `<h1>PonyRacer</h1> 
    <h2>{{numberOfUsers}}</h2>` 
}) 
export class PonyRacerApp { 

    numberOfUsers: number = 146; 
} 

Podczas korzystania z tych, zadeklarować szablonów sznurki, a nie zwykłe sznurki. Są częścią ES6 (aka ECMAScript 2015):

Literały szablonów to literały łańcuchowe umożliwiające wyrażenia osadzone. Możesz korzystać z wielu linii i funkcji interpolacji ciągów. Zostały one nazwane "ciągami szablonów" we wcześniejszych edycjach specyfikacji ES2015/ES6.

Więcej informacji na ten temat: MDN lub TypeScript Deep Dive.