Ashley Prescott Ashley Prescott - 3 months ago 78
AngularJS Question

New line breaks typescript code in Angular 2

I have this code which works as expected;

import {Component} from 'angular2/core';

@Component({
selector: 'media-tracker-app',
templateUrl: 'app/app.component.html',
styles: [' h1 { color: #ffffff; }']
})

export class AppComponent {}


but if I put some new lines in to make the CSS more readable like this:

import {Component} from 'angular2/core';

@Component({
selector: 'media-tracker-app',
templateUrl: 'app/app.component.html',
styles: [' h1 {
color: #ffffff;
}']
})

export class AppComponent {}


... then it breaks my code.

In the console I get:
SyntaxError: unterminated string literal

I am just starting to learn Angular 2... any ideas?

Ven Ven
Answer

That's totally unrelated to either TypeScript or AngularJS: JavaScript strings using ' and " are not multilines.

You have two options:

  • Use a backslash to escape end of line

var a = 'hey\
you';
  • Use ES6 template strings (using backticks):

var a = `hey
you`;
Comments