Twig 模板内容的 Javascript 正则表达式

Question

我使用富文本编辑器允许在线修改 Twig 模板。 Twig 是一个模板引擎，使用以下语法来显示变量:

{{ object.property }}

它还使用函数生成 URLS，例如:

{{ url('mr_message_read', {id: message.id}) }}

现在我想要的是在我的编辑器旁边显示模板中使用的 TWIG 变量和函数列表。为此，我将当前内容检索为带有 Twig “关键字”的 HTML，如上所示。要提取关键字，我使用下面的正则表达式:

var reg = /{{[^}]+}}/g;
var match = text.match(reg);
console.log( match );

这将适用于示例 1 但不适用于 示例 2，因为 Twig 函数需要 字符串。因此，我尝试了其他几种语法来允许“除了 }} 之外的任何内容”。他们似乎都不合适:

    var reg = /{{[^}]+}}/g; // GOOD but ignores second example
    var reg = /{{[^}}]+}}/g; // Idem
    var reg = /{{[^}}]*}}/g; // Idem
    var reg = /{{(^}}+)}}/; // null
    var reg = /{{(^}})+}}/; // null
    var reg = /\{\{[^\}\}]+\}\}/g; // Ignores second example
    var reg = /\{\{[^}}]+\}\}/g; // Ignores second example
    var reg = /\{\{[^\}\}]+\}\}/g; // Ignores second example
    var reg = /\{\{[^[}}]]+\}\}/g; // Ignores second example

我现在很挣扎。我想这是一个逃避问题，但我被困住了:)

示例内容:

<p>{{ author.fullname }} wrote you a message. Read it here: <a href="{{ url('mr_message_read', {id: message.id}) }}">Messagerie</a>.</p>
<hr />
<blockquote>
<p>{{ message.content|nl2br }}</p>
</blockquote>

---

编辑:我基于 Thomas 代码的解决方案

function getTwigTags(){

    var str = CKEDITOR.instances['form_content'].getData();
    var regex = /{{\s*([^{]*{([^{]*):\s*(.*?)}.*?|[^{]*)\s*}}/g;
    var keywords = new Array();
    let m;

    while ((m = regex.exec(str)) !== null) {
        // This is necessary to avoid infinite loops with zero-width matches
        if (m.index === regex.lastIndex) {
            regex.lastIndex++;
        }

        // The result can be accessed through the `m`-variable.
        m.forEach((match, groupIndex) => {
            if(match !== 'undefined' && groupIndex == 1)
                // console.log(`Found match: group ${groupIndex}: ${match}`);
                keywords[keywords.length] = match;
        });
    }

    return keywords;
}

Answer 1

您可以使用此代码:

const regex = /{{\s*([^{]*{([^{]*):\s*(.*?)}.*?|[^{]*)\s*}}/g;
const str = `{{ url('mr_message_read', {id: message.id}) }}
{{ object.property }}`;
let m;

while ((m = regex.exec(str)) !== null) {
    // This is necessary to avoid infinite loops with zero-width matches
    if (m.index === regex.lastIndex) {
        regex.lastIndex++;
    }
    
    // The result can be accessed through the `m`-variable.
    m.forEach((match, groupIndex) => {
      if(match !== 'undefined' && groupIndex > 0)
        console.log(`Found match: group ${groupIndex}: ${match}`);
    });
}