如何挂钩异步事件骨干显示HTML的 [英] How to hook async Backbone event to display of HTML

查看:99
本文介绍了如何挂钩异步事件骨干显示HTML的的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我所要做的是拨打电话到数据库,然后显示结果一些HTML。我所拥有的一切工作(数据来自数据库就好回),但我想不出来显示数据。

What I am trying to do is make a call to the database and then display the result in some HTML. I have everything working (the data comes back from the database just fine), except I can't figure out to display the data.

我知道取()是异步的,但我不知道如何将其连接到我的收藏观。这里是我的骨干:

I know that fetch() is async, but I'm not sure how to wire it into my collection view. Here is my Backbone:

    (function() {
        window.App = {
            Models: {},
            Collections: {},
            Views: {},
            Router: {}
        };

        window.template = function(id) {
            return _.template( $('#' + id).html() );
        };

        App.Models.Main = Backbone.Model.extend({
            defaults : {
                FName: ''
            }
        });

        App.Collections.Mains = Backbone.Collection.extend({
            model: App.Models.Main,
            initialize: function(mains) {
                this.fetch({success: function(main) {
                    $('#web-leads').html(main);
                }});
            },
            url: '../leads/main_contact'
        });

        App.Views.Mains = Backbone.View.extend({
            tagName: 'ul',
            render: function() {
                var ul = this.collection.each(this.addOne, this);
                return ul;
            },
            addOne: function(main) {
                var mainC = new App.Views.Main({ model: main});
                this.$el.append(mainC.render().el);
                return this;
            }
        });

        App.Views.Main = Backbone.View.extend({
            tagName: 'li',
            template: template('mainContactTemplate'),
            render: function () {
                this.$el.html(this.template(this.model.toJSON()));
                return this;
            }

        });

        main = new App.Views.Main();
        mains = new App.Collections.Mains(main);

    })();

我需要能够为呼叫 $('#网络线索)HTML()电源返回的值。我该怎么做呢?

推荐答案

有关这类的东西骨干的一般模式是:

The general pattern for this sort of thing in Backbone is:


  1. 创建一个模型或集合

  2. 该模型/ colleciton传递给视图

  3. 这一观点注册型号/集
  4. 事件处理程序
  5. 模型/收集触发一个AJAX请求(可能在响应调用)

  6. 视图的触发事件处理程序

  7. 视图的事件处理程序更新页面

  1. create a model or collection
  2. pass that model/colleciton to a view
  3. that view registers an event handler on the model/collection
  4. the model/collection triggers an AJAX request (probably in response to a fetch call)
  5. the view's event handler is triggered
  6. the view's event handler updates the page

所以,作为亩太短建议,最好的办法是遵循这种模式,让您的视图处理程序绑定到您的收藏的重置事件。

So, as mu is too short suggested, your best bet is to follow this pattern and have your view bind a handler to your collection's reset event.

值得然而提的是,重置不会永远是你要绑定的事件。例如,您可能不希望除非它改变属性模型的X回应一个AJAX请求。在这种情况下,你可以改为绑定到的变化:X ,然后如果Ajax响应已更改X您的处理程序只会触发

It's worth mentioning however that reset won't always be the event you want to bind. For instance, you might not want to respond an AJAX request unless it changed attribute 'X' of the model. In that case you could instead bind to change:X, and then your handler would only be triggered if the AJAX response changed X.

要查看所有可能的选项,请参阅:

To see all your possible options, see:

http://documentcloud.github.com/backbone/#Events-catalog

这篇关于如何挂钩异步事件骨干显示HTML的的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆