Question

我正在使用小胡子构建一个字符串，替换其中的几个变量。我很乐意使用TemplateString，但我需要在运行时解析我的字符串，而不是在代码编译时，因为我从外部源读取模板字符串。

要明确：

// mustachy example
// template is "foo{{who}}" and myData.whmustao = "manchu"
let myResult = mustache.render(getMyTemplate(),myData);
console.log(myResult);   // "foomanchu"

这很轻巧，我很想使用TemplateString，但正如下面的例子所示 - 我无法想象一种方法从外部提供字符串......

// ES6xy example
let myResult = `foo${myData.who}`;   // can't get this at runtime
console.log(myResult);    // "foomanchu"

但是，我无法想象实现这一目标的直接，干净，非偷偷摸摸的方式。你能吗？

Answer 1

我假设您正在客户端上加载数据，并希望根据返回的数据生成字符串。您可以使用一个可以为您返回生成的字符串的函数

function generateString(val1, val2) {
  return `foo${val1} bar${val2};
}

你可以在客户端调用该函数作为获得val1和val2的api调用的结果吗？

如果您延迟响应直到获得所需的所有数据

，此策略也可以在服务器上运行

Answer 2

将模板字符串放入函数中，并传递myData

let renderMyTemplate = data => `foo${data.who}`;
//or
let renderMyTemplate = ({who}) => `foo${who}`;


let myResult = renderMyTemplate(myData);
console.log(myResult);

Answer 3

感谢您的回复和创意解决方案。但是，我认为没有解决方案，因为TemplateStrings是一个代码内功能，而其他模板解决方案（如胡子）是一个数据驱动的功能。

换句话说，ES6的模板字符串是一种语言功能，它将其功能限制为静态代码内字符串。任何其他想象的灵活性必须依赖于您注入应用程序的代码的动态执行，这是每个黑客的梦想。

所以我原来的想法的答案，关于Mustache是否对你的源中没有硬编码的简单字符串来说是过度的 - 是的。 Mustache是这种情况下可接受的解决方案。

Javascript ES6 TemplateString一个TemplateString

3 个答案: