代码之家  ›  专栏  ›  技术社区  ›  user1692342

在主干视图中定义的下划线模板内调用函数

  •  1
  • user1692342  · 技术社区  · 7 年前

    在我看来:

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

    <%= testFunction(10) %>
    

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

    1 回复  |  直到 7 年前
        1
  •  3
  •   Emile Bergeron Rudy Hinojosa    7 年前

    _.extend 不是这样工作的,它需要2个或更多的对象,关键点将被合并。 看起来你可能从 this other question ,但它不正确和/或过时。

    _.extend(destination, *sources)

    浅显地复制 来源 目的地 对象,并返回 目的地 对象任何 嵌套的对象或数组将通过引用复制,而不是复制。 它是有序的,所以最后一个源将覆盖相同的属性

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

    这将起作用:

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

    _.延伸

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