Question

我正在创建一个骨干应用程序。这个当前代码有效，但现在我想从服务器获取数据。我在/ 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/

感谢

TIRED

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

$(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

Answer 1

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

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

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

如何从骨干网中的服务器获取数据

1 个答案: