合并angular2模板时在html中的EOF字符？

我有一个nodeJS应用程序读取目录中的所有.md文件，然后使用marked将其内容呈现为HTML。 然后我将结果用作Angular2模板。

但是，我现在正在得到像这样的控制台错误：

 Unhandled Promise rejection: Template parse errors: Unexpected character "EOF" (Do you have an unescaped "{" in your template? Use "{{ '{' }}") to escape it.) ("width="760" height="1300" frameborder="0" marginheight="0" marginwidth="0">Loading...</iframe> </div>[ERROR ->]"): chapterComponent@1805:6 Invalid ICU message. Missing '}'. (" <code>css [ERROR ->]{{' Page { background-color: white; "): chapterComponent@395:0 ; Zone: <root> ; Task: Promise.then ; Value: BaseException {message: "Template parse errors:↵Unexpected character "EOF" …ckground-color: white;↵"): chapterComponent@395:0", stack: "Error: Template parse errors:↵Unexpected character…st:3000/node_modules/zone.js/dist/zone.js:356:38)"} 

我不确定这是否是因为合并的单个文件中的EOF字符出现，或者我的转义出现了问题，因为错误信息也在暗指。

在错误底部引用的代码片段如下所示：

 <code>css {{' Page { background-color: white; font-size: 17; } TextField { margin: 10; padding: 10; } Image { margin-top: 20; margin-left: 0; margin-right: 0; margin-bottom: 80; } Button { margin: 10; padding: 10; } '}}</code> 

注意： chapterComponent@1805:6是文件的结尾

Answer 1

更新

我认为你需要用{{'}'}}replace每个{ {{'{'}}和} ，如错误消息所示。

根据评论不工作

尝试反引号而不是单引号。 单引号仅适用于单行string。

 <code>css {{` Page { background-color: white; font-size: 17; } TextField { margin: 10; padding: 10; } Image { margin-top: 20; margin-left: 0; margin-right: 0; margin-bottom: 80; } Button { margin: 10; padding: 10; } `}}</code> 

Answer 2

它发生在我身上，因为我错误地将template url放在scss地方， scss url放在template地方。 它可能会帮助你，因为你会得到同样的错误，你不知道发生了什么

错误

 @Component({ selector: 'sd-select', templateUrl: './select.component.scss', styleUrls: ['./select.component.html'], providers: [SELECT_VALUE_ACCESSOR], encapsulation: ViewEncapsulation.None }) 

正确

 @Component({ selector: 'sd-select', templateUrl: './select.component.html', styleUrls: ['./select.component.scss'], providers: [SELECT_VALUE_ACCESSOR], encapsulation: ViewEncapsulation.None })