TypeScript - Angular: Multiline string
<p>I'm an Angular 2 beginner and I've written this piece of code in my <code>dev/app.component.ts</code>:</p>

<pre class="lang-js prettyprint-override"><code>import {Component} from 'angular2/core';

@Component({
    selector: 'my-app',
    template: '&lt;h3 (click)="onSelect()"&gt; {{contact.firstName}} {{content.lastName}}&lt;/h3&gt;'
})
export class AppComponent {
    public contact = {firstName:"Max", lastName:"Brown", phone:"3456732", email:"max88@gmail.com"};

    public showDetail = false;
    onSelect() {
        this.showDetail=true;
    }
}
</code></pre>

<p>It works, when I go to the browser "Max Brown is displayed".</p>

<p>Now, I want to write the template part on different lines like this:</p>

<pre class="lang-js prettyprint-override"><code>import {Component} from 'angular2/core';

@Component({
    selector: 'my-app',
    template: '&lt;h3 (click)="onSelect()"&gt;
    {{contact.firstName}} {{contact.lastName}}&lt;h3&gt;'
})
export class AppComponent {
    public contact = {firstName:"Max", lastName:"Brown", phone:"3456732", email:"max88@gmail.com"};

    public showDetail = false;
    onSelect() {
        this.showDetail=true;
    }
}
</code></pre>

<p>But I get this error in Chrome console: </p>

<pre><code>Uncaught TypeError: Cannot read property 'split' of undefined
</code></pre>