TypeScript-角度:多行字符串 [英] TypeScript - Angular: Multiline string

问题描述

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

I'm an Angular 2 beginner and I've written this piece of code in my 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;
    }
}

当我转到浏览器显示了最大的布朗"时，它起作用了.

It works, when I go to the browser "Max Brown is displayed".

现在，我想像这样在不同的行上编写模板部分:

Now, I want to write the template part on different lines like this:

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控制台中收到此错误:

But I get this error in Chrome console:

Uncaught TypeError: Cannot read property 'split' of undefined

推荐答案

将文本用`(反引号)代替而不是单引号'，然后可以跨越多行.

Wrap the text in ` (backticks) instead of single quotes ', then it can span multiple lines.

var myString = `abc
def
ghi`;

这篇关于TypeScript-角度:多行字符串的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！