调用在 Backbone.js 视图中定义的下划线模板内的函数

gxwragnw  于 2022-11-10  发布在  其他
关注(0)|答案(1)|浏览(171)

我尝试在下划线模板内调用自定义函数,但收到错误:未定义testFunction。
在我的脊背上看来:

initialize: function() {
    this.testFunction = function (x) {
        alert("Hello " + x);
    }
}

render: function() {
    var data = _.extend({"output":output}, this.testFunction);
    $(this.el).html(this.template(data));
    return this;
}

在我的模板中,我调用了test函数:

<%= testFunction(10) %>

但是我得到一个错误testFunction没有定义。

nlejzf6q

nlejzf6q1#

_.extend并不是这样工作的,它需要2个或更多的对象,并且键将被合并。* 看起来你可能是从this other question中获得了这个代码片段,但是它是不正确的和/或过时的。*

扩展_.extend(destination, *sources)

source对象中的所有属性复制到destination对象,并传回destination对象。任何巢状对象或数组都会以传址方式复制,而不是复制。它是依序的,所以最后一个来源会覆写先前参数中相同名称的属性。

_.extend({name: 'moe'}, {age: 50});
=> {name: 'moe', age: 50}

这是可行的:

_.extend({ output: output }, { testFunction: this.testFunction });

但是在这个简单的例子中,更好的方法是完全避免_.extend

this.$el.html(this.template({
    output: output,
    testFunction: this.testFunction
}));

在真实的生活中,您可能希望在函数中使用视图context ( this ),为此,在将函数传递给模板时,您需要在函数中使用.bind(this)

this.$el.html(this.template({
    output: output,
    testFunction: this.testFunction.bind(this)
}));

相关问题