TypeScript : Colon vs Equal To ( Angular Tutorial )

Look again at the AppComponent:

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

The first field definition:

title = 'Tour of Heroes';

is assigning a string value. Because that value is a string, TS can infer the type. The line is equivalent to:

title: string = 'Tour of Heroes';

The second field definition

hero: Hero = {
  id: 1,
  name: 'Windstorm'
};

is assigning an object, which could be any type. So here, to get the most out of TS, we should be specific about the kind of thing it will be. It could also be written:

hero: { id: number, name: string } = {...};

In the Hero class, you're only setting types, no default values. The pattern is actually the same in both:

name[: type][ = value];

It's probably worth having a look in the TS handbook for more information about types and class definitions.

: is used in JSON for value, example:

{ name: "name value" };

: is also used in typescript to define an objects type. For example:

myObj: JSON;

= is used to make an assignment outside of the JSON.

myObj: JSON = { name: "name value" }; // meaning myObj has type JSON and is equal to { name: "name value" };

The problems in your code:

title : 'Tour of Heroes',  <-- Here you are making titles **type** 'Tour of Heroes'

I suggest you to read the basic documentation of typescript: https://www.typescriptlang.org/docs/handbook/basic-types.html