javascript - 使用 Jinja 的 "{% break %}"会破坏我的 Javascript 代码。我该如何解决这个问题？

Question

不是双关语...

我对 Javascript 和 Flask 相当陌生......这里的代码:

// searches for a name in the list of persons
function searchFName(){
    var userInput = document.getElementById("search").value;
    var fname = "";

    {% for i in range(persons|length) %}
        fname = {{ persons[i].fname|tojson }};

        if(userInput == fname)
        {
            alert(userInput + "found!");
        }
    {% endfor %}
}

工作得很好。它迭代人员列表，并检查他们的名字是否与用户提供的名字匹配......基本上是一个搜索功能。

但是，如果已经找到此人，我不想让 Jinja 继续遍历列表。

所以我尝试在此处添加 {% break %} :

    if(userInput == fname)
    {
        alert(userInput + "found!");
        {% break %}
    }

该函数停止工作，并在控制台上显示错误:

Uncaught SyntaxError: Unexpected end of input

我知道这个问题可能很愚蠢而且简单，但我已经搜索了很多，但还没有找到任何人有同样的问题。

有关于如何解决此问题或解决方法的说明吗？

谢谢!

Answer 1

However, I don't want to keep Jinja iterating over the list if the person has already been found.

模板无法确定这一点。模板在查看页面时呈现，而不是在调用函数时呈现 - {% break %} 将始终跳出循环，并且不会生成函数的其余部分。出现语法错误的原因是 {% break %} 导致 if 语句的右大括号被省略。

最好避免使用模板生成代码。这里更好的方法是让整个数组可供 Javascript 使用，然后使用 Javascript 方法来搜索数组:

function searchFName(){
    var userInput = document.getElementById("search").value;
    var fnames = {{ persons_fnames | tojson }};
    if (fnames.indexOf(userInput) !== -1) {
        alert(userInput + " found!");
   }
}

(请注意，我在这里使用了 persons_fnames 作为变量或表达式的占位符，其中包含每个人的 persons[i].fname 值。此列表也许应该在模板之外生成，以避免在模板文件中放置过多的逻辑。)