使用带_.find的underscore.js模板时发生类型错误

TypeError using underscore.js template with _.find

本文关键字：错误 类型 js find underscore      更新时间：2023-09-26

我正在写一个类似这样的小模板：

var viewHelpers = {
  valExists: function (variable) {
    var exists = ((typeof variable == "string") && (variable != ""));
    console.log('variable exists: ', exists, ' value: ', variable);
    return exists;
  },
}
var tpl = '<h1>Hello <%- _.find(["a", "b"], _.valExists) %></h1>';
_.extend(data, viewHelpers);
console.log(_.template(tpl, {
  data: data,
}));

我希望模板返回'<h1>你好a<h1>'。

相反，Firefox显示此错误：

TypeError: t is undefined

怎么了？

我理解错误。现在我找到了解决方案。

当在_对象中找不到函数时，就会出现上述问题。而且viewHelper根本不应该绑定到_对象。它们应该只是提供给模板的数据的一部分。

我的代码应该是这样的：

var tpl = '<h1>Hello <%- _.find(["a", "b"], valExists) %></h1>';
var datalist = {
    data: data,
    valExists: function (variable) {
        var exists = ((typeof variable == "string") && (variable != ""));
        console.log('variable exists: ', exists, ' value: ', variable);
        return exists;
    },
    printExists: function (variables) {
        return _.find(variables, valExists);
    }
}
console.log(_.template(tpl, datalist));

这些viewHelper实际上与数据列表中的其他变量生活在同一个命名空间中。

为了让它看起来更好，我可以将viewHelper的定义与数据列表分开：

var tpl = '<h1>Hello <%- _.find(["a", "b"], valExists) %></h1>';
var viewHelpers = {
    valExists: function (variable) {
        var exists = ((typeof variable == "string") && (variable != ""));
        console.log('variable exists: ', exists, ' value: ', variable);
        return exists;
    },
    printExists: function (variables) {
        return _.find(variables, valExists);
    }
}
var datalist = {
    data: data,
}
// add the viewHelpers definition to datalist
_.extend(datalist, viewHelpers);
//
console.log(_.template(tpl, datalist));

它们实际上是一样的。

当提供给模板的数据中不存在我的viewHelper时，就会出现我的错误。

相关文章：