TypeScript - Angular：多行字符串

Question

我是 Angular 2 初学者，我已经在我的 dev/app.component.ts 中编写了这段代码：

 import {Component} from 'angular2/core';

@Component({
    selector: 'my-app',
    template: '<h3 (click)="onSelect()"> {{contact.firstName}} {{content.lastName}}</h3>'
})
export class AppComponent {
    public contact = {firstName:"Max", lastName:"Brown", phone:"3456732", email:"[e-mail]"};

    public showDetail = false;
    onSelect() {
        this.showDetail=true;
    }
}

当我转到浏览器“显示 Max Brown”时，它可以工作。

现在，我想在不同的行上编写模板部分，如下所示：

 import {Component} from 'angular2/core';

@Component({
    selector: 'my-app',
    template: '<h3 (click)="onSelect()">
    {{contact.firstName}} {{contact.lastName}}<h3>'
})
export class AppComponent {
    public contact = {firstName:"Max", lastName:"Brown", phone:"3456732", email:"[e-mail]"};

    public showDetail = false;
    onSelect() {
        this.showDetail=true;
    }
}

但我在 Chrome 控制台中收到此错误：

 Uncaught TypeError: Cannot read property 'split' of undefined

原文由 splunk 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

将文本 ` （反引号）而不是单引号 ' ，然后它可以跨越多行。

 var myString = `abc
def
ghi`;

原文由 Günter Zöchbauer 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

const multiLineString = [
    "I wish, ",
    "There was a better way to do this!"
].join();

原文由 Jay Douglass 发布，翻译遵循 CC BY-SA 4.0 许可协议