TypeScript mehrzeiliger Code nicht erkannt

Question

Bitte helfen Sie mir mit diesem Fehler beim Codieren mit Typescript in Sublime und VS Code. Es kann nur im Browser erkannt und korrekt angezeigt werden, wenn sich der Code template: in einer einzigen Zeile befindet.

Wenn ich versuche, es in mehrere Zeilen zu zerlegen, kann der Browser das Ergebnis nicht wie erwartet anzeigen.

Unten finden Sie den vollständigen Code von dem, was ich tue:

import { Component } from '@angular/core'; 

export class Hero { 
    id: number; 
    name: string; 
} 

@Component({ 
    selector: 'my-app', 
    template:'<h1>{{title}}</h1><h2>{{hero.name}} details!</h2><div><label>id: </label>{{hero.id}}</div><div><label>name: </label>{{hero.name}}</div>', 
}) 

export class AppComponent { 
    title = 'Tour of Heroes'; 
    hero = Hero { 
     id: 1; 
     name: 'Windstorm'; 
    } 
} 

Dieses Tutorial ist von angular.io

Answer 1

Sie müssen Backticks verwenden, wenn mehrere Linien

@Component({ 
    template: ` 
     //code here 
    ` 
}) 

schreiben Verwenden Sie Vorlagen mit großen HTML-Mengen.

@Component({ 
    templateUrl: "PATH HERE" 
}) 

Hoffnung, die