Javascript 将下划线.js模板与u.find一起使用时出现TypeError

我在写一个小模板，像这样：

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

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

---

怎么了？

我理解不对。现在我找到了解决办法

当在

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

我的代码应该如下所示：

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

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

var-tpl='Hello'；
变量数据列表={
数据：数据，
valExists：函数（变量）{
变量exists=（（typeof variable==“string”）&&（variable！=”）；
log（'变量存在：'，存在，'值：'，变量）；
回报存在；
},
printExists：函数（变量）{
返回u.find（变量，valExists）；
}
}
console.log（u.template（tpl，datalist））；

这些ViewHelper实际上与datalist中的其他变量位于同一命名空间中

为了使它看起来更好，我可以将viewHelper的定义与datalist分开：

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

var-tpl='Hello'；
变量查看帮助程序={
valExists：函数（变量）{
变量exists=（（typeof variable==“string”）&&（variable！=”）；
log（'变量存在：'，存在，'值：'，变量）；
回报存在；
},
printExists：函数（变量）{
返回u.find（变量，valExists）；
}
}
变量数据列表={
数据：数据，
}
//将viewHelpers定义添加到数据列表
_.扩展（数据列表、视图帮助程序）；
//
console.log（u.template（tpl，datalist））；

它们实际上是一样的

当提供给模板的数据中不存在我的ViewHelper时，会发生我的错误