1. ホーム
  2. typescript

[解決済み] TypeScript - Angular: 複数行の文字列

2022-03-01 17:18:05

質問

私は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:"[email protected]"};

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

ブラウザにアクセスすると、quot;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:"[email protected]"};

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

しかし、Chromeのコンソールでこのようなエラーが表示されます。

Uncaught TypeError: Cannot read property 'split' of undefined

解決方法は?

テキストを ` (シングルクォートではなく、バッククォートで囲んでください。 ' であれば、複数行にまたがることも可能です。

var myString = `abc
def
ghi`;