时间戳

首页 > 解决方案 > 从混合字符串/JSON 数据中提取特定变量

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

问题描述

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

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

用户输入将是：

您好User Name ×，短信已发送到您的手机Phone Number ×。

这个简单的例子返回：

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

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

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

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

但是，由于whitelist是可翻译的，并且可以翻译成其他语言，我find and replace以后不容易，所以我需要的是codeJSON 白名单中的属性，而不是value. 我找不到方法的预期结果是：

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

谢谢。

标签： javascriptjson

解决方案

您可以创建自定义转换函数，以您喜欢的方式对其进行转换，您可以执行以下操作。

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));

推荐阅读