Angular2: Error: unexpected value 'AppComponent' declared by the module 'AppModule'

Decorators are related classes or variables which are following the declaration of the decorator.

In your code the @compoment decorator is over const HEROES and this must be over class AppComponent.

So your code should be the following:

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

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


export const HEROES: Hero[] = [
    { id: 11, name: 'Mr. Nice' },
    { id: 12, name: 'Narco' },
    { id: 13, name: 'Bombasto' },
    { id: 14, name: 'Celeritas' },
    { id: 15, name: 'Magneta' },
    { id: 16, name: 'RubberMan' },
    { id: 17, name: 'Dynama' },
    { id: 18, name: 'Dr IQ' },
    { id: 19, name: 'Magma' },
    { id: 20, name: 'Tornado' }
];


@Component ({
    selector: 'my-app',
    template: `
        <h1>{{title}}</h1>

        <h2>My Heroes</h2>
        <ul class="heroes">
            <li *ngFor="let hero of heroes">
                 <span class="badge">{{hero.id}}</span> {{hero.name}}
            </li>
         </ul>        

         <h2>{{hero.name}} details!</h2>
         <div><label>id: </label>{{hero.id}}</div>
         <div>
             <label>name: </label>
             <input [(ngModel)]="hero.name" placeholder="name">
         </div> 
         ` 
 })
export class AppComponent {
    title = 'Tour or Heroes';
    heroes = HEROES;
}

I'll quickly note that this error can be thrown from any manner of @Component declaration error — I.e., even @Component({}); — (note the semicolon).

If you receive this error, make sure to check that your syntax is correct.

True as of 2.0.0-rc.6.