为什么Angular2 Component属性没有显示在我的页面中？

Question

这是我的代码：

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

@Component({
  selector: 'my-app',
  template: `
      <h1>{{title}}</h1>
      <h2>{{secondTitle}}</h2>
      <main-page></main-page>
     `
})

export class AppComponent {
  title = 'Lovely Jubbly';
  secondTitle: 'Bummer...'
}

我的网站上出现了标题“ Lovely Jubbly”，但是第二标题“ Bummer ...”没有显示。 唯一的不同是我如何初始化这些变量。 我是TypeScript和Angular2 noob，所以这可能是一个明显的错误。 谁能将我引向一些可以解释这种现象的文档？

Answer 1

TypeScript将Bummer...解释为一种类型 （例如，只能为"Bummer..."的字符串）。 当变成JavaScript时，它仍将初始化为null。

如果您想知道，这些类型对于某些类似于枚举的变量可能很有用。 例如：

var trafficLightState:'RED' | 'GREEN' | 'YELLOW' = 'RED';
trafficLightState = 'Melon'; // ERROR!