从混合字符串/JSON 数据中提取特定变量

Question

我将Tagify与我构建的自定义 AngularJS 指令一起使用，Tagify 混合输入返回单个字符串中选定标签和文本的 JSON 对象，例如：

\n

var tagify = new Tagify(myElement, {\n    mode: \'mix\',\n    pattern: /@/,\n    whitelist: [{ value: "User Name", code: \'$name\' }, { value: "Phone Number", code: \'$phone\' }],\n    enforceWhitelist: true,\n    dropdown: {\n        maxItems: 20,\n        classname: "tags-look",\n        enabled: 0,\n        closeOnSelect: true\n    }\n});\ntagify.on(\'change\', () => console.log(tagify.DOM.input.value))\n

\n

用户输入将是：

\n

\n

您好User Name \xc3\x97，短信已发送至您的手机Phone Number \xc3\x97。

\n

\n

这个简单的例子返回：

\n

\n

您好[[{ value: "User Name", code: \'$name\' }]]，短信已\n发送到您的手机[[{ value: "Phone Number", code: \'$phone\' }]]。\n（返回的 JSON 已转义）

\n

\n

我稍后要做的是将用户选择的标签（通过键入@字符并从下拉列表中选择它们）替换为我自己的动态变量。

\n

我能够得到一个很好的结果，tagify.DOM.input.textContent因为它呈现了以下结果：

\n

\n

您好，用户名，短信已发送至您的手机号码。

\n

\n

但是，由于whitelist是可翻译的并且可以是我find and replace以后无法轻松翻译的其他语言，因此我需要的是codeJSON 白名单中的属性而不是value. 我还没有找到方法达到的预期结果是：

\n

\n

Hello $name, the SMS has been sent to your phone $phone。

\n

\n

谢谢。

\n

Answer 1

您可以创建自定义转换函数，以您喜欢的方式转换它，您可以执行类似的操作。

function transformer(value) {
    return value.replace(/\[\[(.*?)\]\]/g, (arr => {
     let json = JSON.parse(arr);
     return json[0].map(e => e.code).join(', ');
    }))
 }

然后你可以在更改时调用它（或者更确切地说在提交时/或提交之前），如下所示：

tagify.on('change', (e) => transformer(e.detail.value));