Backbone.js的查看实例变量？ [英] Backbone.js view instance variables?

问题描述

我学习Backbone.js的，我试图弄清楚它是否可以有实例变量的骨干看法。

I'm learning Backbone.js and am trying to figure out whether it's possible to have instance variables in Backbone views.

我的目标是当一个视图被实例化从外部文件加载视图的模板。目前我将它们存储在骨干应用程序的全局命名空间的全局变量，但它是清洁剂中的模板存储在一个视图的实例变量。目前，我有它设置如下：

My goal is to load a view's templates from an external file when a view is being instantiated. Currently I'm storing them in a global variable in the Backbone app's global namespace, but it would be cleaner to store the templates in a view's instance variables. Currently I have it set up like this:

var templates = {};

MessageView = Backbone.View.extend({

    initialize: function() {
        $.get('js/Test2Templates.tpl', function(doc) {

            var tmpls = $(doc).filter('template');

            templates['MessageView'] = [];

            tmpls.each(function() {
                templates.MessageView[this.id] = $.jqotec($.unescapeHTML(this.innerHTML));
            });
        });
    },

    render: function() {
        var tpldata = {name: 'Ville', thing: 'Finland'};
        $('#display').jqoteapp(templates.MessageView.greeting_template, tpldata);
    },

    events: {
        "click input[type=button]": "additionalTransactions"
    },

    additionalTransactions: function() {
        this.render();
    }

});

但是，而不是使用被定义为一个全局变量的模板，我想在一个视图的初始化函数创建'模板'，沿着这些线路（但不工作）：

But instead of using "templates" being defined as a global var, I'd like to create 'templates' in a view's initialize function, along these lines (but this doesn't work):

MessageView = Backbone.View.extend({

    view_templates: {},

    initialize: function() {
        $.get('js/Test2Templates.tpl', function(doc) {

            var tmpls = $(doc).filter('template');

            tmpls.each(function() {
                this.view_templates[this.id] = $.jqotec($.unescapeHTML(this.innerHTML));
            });
        });
    },

    render: function() {
        var tpldata = {name: 'Ville', thing: 'Suomi'};
        $('#display').jqoteapp(this.view_templates.greeting_template, tpldata);
    },

    events: {
        "click input[type=button]": "additionalTransactions"
    },

    additionalTransactions: function() {
        this.render();
    }

});

这可能是（？）pretty简单的和/或显而易见的，但我是某处的Backbone.js的学习曲线，我更AP preciate任何帮助，这!!谢谢！

This is probably (?) pretty straightforward and/or obvious, but me being somewhere on the Backbone.js learning curve, I'd much appreciate any help with this!! Thanks!

推荐答案

您 view_templates 实例变量是罚款（和一个不​​错的主意为好）。你只需要确保你使用正确的这个里面的 $。获得（）回调和内你的 tmpls.each（）电话。我想你想你的初始化看起来更像是：

Your view_templates instance variable is fine (and a good idea as well). You just have to be sure that you're using the right this inside your $.get() callback and inside your tmpls.each() call. I think you want your initialize to look more like this:

initialize: function() {
    this.view_templates = { };

    var _this = this;
    $.get('js/Test2Templates.tpl', function(doc) {
        var tmpls = $(doc).filter('template');
        tmpls.each(function() {
            _this.view_templates[this.id] = $.jqotec($.unescapeHTML(this.innerHTML));
        });
    });
},

我不知道该 this.id 你想要的 tmpls.each内（）但我猜你想要的DOM ID 从当前模板属性，所以我把它作为 this.id 。

I'm not sure which this.id you want inside the tmpls.each() but I'm guessing that you want the DOM id attribute from the current template so I left it as this.id.

在构造函数中 this.view_templates 分配（初始化）的需要，因为你presumably希望每个视图的实例有其自己的阵列的副本。创建一个新的视图实例不会做视图的深拷贝，所以如果你只是有：

The this.view_templates assignment in your constructor (initialize) is needed because you presumably want each instance of the view to have its own copy of the array. Creating a new view instance doesn't do a deep copy of the the view so if you just have:

MessageView = Backbone.View.extend({
    view_templates: {},
    // ...

那么所有的情况下，最终将共享相同的 view_templates 对象和 view_templates 将表现更像是一个类变量不是一个实例变量。

then all the instances will end up sharing the same view_templates object and view_templates will behave more like a class variable than an instance variable.

您可以根据文档的形式指定视图定义的实例变量（即 Backbone.View.extend（）通话），但你会希望任何初始化他们应该表现为在初始化方法的实例变量;只读或类变量像事件可以保留作为视图定义的一部分。

You can specify your instance variables in the view definition (i.e. the Backbone.View.extend() call) as a form of documentation but you will want to initialize any of them that should behave as an instance variable in your initialize method; read-only or "class variables" like events can be left as part of the view's definition.

这篇关于Backbone.js的查看实例变量？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！