javascript - 检测handlebars.js 解析/语法错误。 (客户端模板)

Question

我正在创建客户端 Handlebars 的模板编辑器。基本上，屏幕的一半是文本编辑器，另一半是预览窗口。文本编辑器中的内容在被 handlebars.js 解析后记录到预览窗口中。 ，在此过程中应用一些变量。

每当我使用 handlebar's expression 出现任何语法错误时(例如输入 {name}} 而不是 {{name}})，DevTools 中会出现一条控制台消息。这些消息可能如下所示:

Parse error on line 4:
...m"><p>Hola, {{name}</p></div></body>
---------------------^
Expecting 'CLOSE_RAW_BLOCK', 'CLOSE', 'CLOSE_UNESCAPED', 'OPEN_SEXPR', 'CLOSE_SEXPR', 'ID', 'OPEN_BLOCK_PARAMS', 'STRING', 'NUMBER', 'BOOLEAN', 'UNDEFINED', 'NULL', 'DATA', 'SEP', got 'INVALID'

我希望能够检测此错误是否触发，并显示错误消息以警告用户。我尝试重写 javascript Error() 类，但没有成功，但它会引发各种错误并且 Handlebars 崩溃。有什么方法可以访问这些错误吗？

Answer 1

您可以捕获错误然后显示它。像这样的事情:

var template = Handlebars.compile('<p>Hola, {{name}</p>');
try {
  template();
} catch (error) {
  var encodedError = error.message.replace(/[\u00A0-\u9999<>\&]/gim, function(i) {
    return '&#' + i.charCodeAt(0) + ';';
  });
  document.write('<pre>' + encodedError + '</pre>');
}

<script src="https://s3.amazonaws.com/builds.handlebarsjs.com/handlebars.min-v4.7.7.js"></script>

(顺便说一句， here 是我借用 html 实体编码的地方。)