1

我正在主干中创建一个应用程序。此当前代码有效,但现在我想从服务器获取数据。我在 /myfriends/getData 的方法返回朋友姓名等的 json。我怎样才能使这段代码从服务器获取该 json。我读了一点,他们正在使用路由等……我只需要在我的应用程序的一个页面上使用它,所以我不想做很多路由等

谢谢

$(function() {



FriendList = Backbone.Collection.extend({
    initialize: function(){
        this.bind("add", function( model ){
            alert("hey");
            view.render( model );
        })
    }
});

FriendView = Backbone.View.extend({

    tagName: 'li',

    events: {
        'click #add-input':  'getFriend',
    },

    initialize: function() {
        this.friendslist = new FriendList;
        _.bindAll(this, 'render');
    }, 

    getFriend: function() {
        var friend_name = $('#input').val();
        this.friendslist.add( {name: friend_name} );
    },

    render: function( model ) {
        $("#friends-list").append("<li>"+ model.get("name")+"</li>");
        console.log('rendered')
    },

});

var view = new FriendView({el: 'body'});
});

这是一个工作副本

http://jsfiddle.net/thomas/Yqk5A/

谢谢

疲劳的

这是我必须显示数据并在建议后尝试但仍然没有运气

$(function() {



FriendList = Backbone.Collection.extend({
    initialize: function(){
        this.bind("add", function( model ){
            alert("hey");
            view.render( model );
        })
    }
});

FriendsServer = new Backbone.Collection({

        initialize: function(){
            url : '/friends/Data',
            this.bind("test", function( model ){
                view.render( model );
            })
        }
});



FriendView = Backbone.View.extend({

    tagName: 'li',

    events: {
        'click #add-input':  'getFriend',
    },

    initialize: function() {
        this.friendslist = new FriendList;
        _.bindAll(this, 'render');
    }, 

    getFriend: function() {
        var friend_name = $('#input').val();
        this.friendslist.add( {name: friend_name} );
    },

    render: function( model ) {
        $("#friends-list").append("<li>"+ model.get("name")+"</li>");
        console.log('rendered')
    },

});



FriendsServerView = Backbone.View.extend({

        tagName: 'div',

        render: function( model ){
            $("#jsonData").html(FriendServer.fetch);
        }

    });

var view = new FriendView({el: 'body'});
var view = new FriendsServerView({el: 'body'});
});

in my html I have a div to populate with json data
4

1 回答 1

3

您只需设置集合的 url 属性并在集合上调用 .fetch() 以从服务器加载数据。更多信息在:

http://backbonejs.org/#Collection-fetch

此外,我会将您的模型/集合事件绑定到您的视图,而不是模型/集合。

于 2012-10-03T20:19:18.393 回答