angular 2和template:未终止的字符串literal.at第6行col 24

Question

在下面的代码中,由于某种原因,当我在模板后面输入一个新行时,它会给我一个错误.我的所有标签必须在一行中'<h1>...<h2> etc.'- 我enter在模板后点击的那一刻:'enter它给了我一个错误.

未终止的字符串literal.at第6行第24行TS错误属性赋值expected.at第7行第10行TS错误','expected.at第7行第25行TS错误类型expected.at第7行第27行TS错误未终止的正则表达式literal.at第7行第28行TS错误','expected.at第8行第1列

import {Component} from 'angular2/core';

@Component({
    selector: 'ponyracer-app',
    template:
    '<h1>PonyRacer</h1>
     <h2>{{numberOfUsers}}</h2>'
})
export class PonyRacerApp {

    numberOfUsers: number = 146;
}

Answer 1

使用`(反引号)而不是'(单引号或双引号)来声明模板字符串:

import {Component} from 'angular2/core';

@Component({
    selector: 'ponyracer-app',
    template:
    `<h1>PonyRacer</h1>
     <h2>{{numberOfUsers}}</h2>`
})
export class PonyRacerApp {

    numberOfUsers: number = 146;
}

当您使用它们时,您声明模板字符串而不是常规字符串.它们是ES6的一部分(又名ECMAScript 2015):

模板文字是允许嵌入表达式的字符串文字.您可以使用多行字符串和字符串插值功能.它们在ES2015/ES6规范的先前版本中被称为"模板字符串".

有关MDN或TypeScript Deep Dive的更多信息.