TypeScript-Fehler in der Angular-Demo

Question

Kann mir jemand sagen, was mit meinem Code los ist, heißt es fortwährend: "Kompilieren fehlgeschlagen". Ich habe die Antwort anderer gefunden, aber mein Code sieht gut aus. Ich weiß immer noch nicht, was die Ursache ist. Vielen Dank.

Die Codes:

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

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

@Component({ 
    selector: 'app-root', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.css'], 
    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' 
    }; 
} 

Die msg Fehler:

ERROR in E:/workspace/angular-tour-of-heroes/src/app/app.component.ts (22,1): Unused label. 
ERROR in E:/workspace/angular-tour-of-heroes/src/app/app.component.ts (22,7): Cannot assign to 'Hero' because it is not a variable. 

Answer 1

let hero: Hero = new Hero(); 
hero.id = 1; 
hero. name = 'Windstorm'; 

Answer 2

Ich habe zu verwirren, dass mein Code gut aussieht und nicht herausfinden kann Ursache des Problems.

Und dann füge ich einen Debugger in meinen Code und versuche, es zu debuggen, obwohl es nicht nützlich sein kann. Aber nachdem ich den 'Debugger' entfernt habe, ist die Kompilierung erfolgreich. Und alles sieht wieder gut aus.

Ich weiß immer noch nicht, was hier vor sich geht.

Ich denke, es ist das npm start Problem. (Der Befehl führt den TypeScript-Compiler im "Watch-Modus" aus, der automatisch neu kompiliert wird, wenn sich der Code ändert).