Question

我有这个代码按预期工作;

import {Component} from 'angular2/core';

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

export class AppComponent {}

但是如果我添加一些新行来使CSS更具可读性：

import {Component} from 'angular2/core';

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

export class AppComponent {}

...然后它破坏了我的代码。

在控制台中，我得到： SyntaxError：unterminated string literal

我刚刚开始学习Angular 2 ......任何想法？

Answer 1

这与TypeScript或AngularJS完全无关：使用'和"的JavaScript字符串不是多行。

您有两种选择：

使用反斜杠来逃避行尾

var a = 'hey\
you';

使用ES6模板字符串（使用反引号）：

var a = `hey
you`;

Answer 2

您可以尝试将文字放入`（反引号）而不是单引号＆＃39;？

您可以查看link：

template: `
  <h1>{{title}}</h1>
  <h2>My favorite hero is: {{myHero}}</h2>
模板是ECMAScript 2015反引号（). The backtick (）中的多行字符串 - 与单引号（＆＃39;）不是同一个字符 - 具有许多不错的功能。我们在这里利用的功能是能够在几行上组合字符串，这使得HTML更具可读性。

新的换行符Angular 2中的打字稿代码

2 个答案: