![](/img/trans.png)
[英]Backbone.js: calling render() from view's Initialize: function
[英]calling one function from another in backbone view Backbone.js
我想要的是使用this.plotPort()從plotLoc調用plotPort; 但我無法......但如果我使用self.plotPort(); 它不適用於IE。 我的解決方法是在重置時向lLoca添加事件以調用plotPort。 為什么this.plotPort不起作用?
var Loca = Backbone.Model.extend({latitude:{},longitude:{}});
var LocaList = Backbone.Collection.extend({
model : Loca,
url : "/getLatLongList"
});
var PortList = Backbone.Collection.extend({
model : Loca,
url : "/getLatLongListForPort"
});
var lLoca = new LocaList;
var lPort = new PortList;
var CreateMap = Backbone.View.extend({
el : 'div',
map : {},
latitude : {},
longitude : {},
initialize : function() {
var lOptions = {};
lOptions.success = this.plotLoc;
lLoca.fetch(lOptions,this);
lLoca.on('reset',this.plotPort(),this);
//_.bindAll(this,'plotPort');
},
plotLoc : function() {
// var test =lLoca.toJSON();
// $('#pchart').html(JSON.stringify(lLoca));
this.latitude = lLoca.toJSON()[0].latitude;
this.longitude = lLoca.toJSON()[0].longitude;
this.latlng = new google.maps.LatLng(this.latitude,
this.longitude);
var mapOptions = {
center : this.latlng,
zoom : 15,
mapTypeId : google.maps.MapTypeId.SATELLITE,
mapTypeControl : false,
streetViewControl : false,
navigationControlOptions : {
style : google.maps.NavigationControlStyle.SMALL
}
};
mapContainer = $("#mapContainer").get(0);
this.map = new google.maps.Map(mapContainer, mapOptions);
_.each(lLoca.models, function(loc) {
var marker = new google.maps.Marker({
position : new google.maps.LatLng(
loc.toJSON().latitude,
loc.toJSON().longitude),
map : this.map,
title : ""
});
}, this);
lLoca.reset();
//console.log(self+"");
//this.plotPort();
},
plotPort : function() {
lPort.fetch({
success: function() {
var postImage = new google.maps.MarkerImage(
"Images/greenflag.png",
new google.maps.Size(50, 50));
var marker = new google.maps.Marker({
position : new google.maps.LatLng(
lPort.toJSON()[0].latitude,
lPort.toJSON()[0].longitude),
map : this.map,
icon : postImage,
title : "From"
});
marker = new google.maps.Marker({
position : new google.maps.LatLng(
lPort.toJSON()[1].latitude,
lPort.toJSON()[1].longitude),
map : this.map,
icon : postImage,
title : "To"
});
}
});
},
render : function() {
return this;
}
});
var App = new CreateMap;
我可以從你的代碼中理解,你應該在執行fetch
之前綁定reset
,並且綁定不正確它應該像這樣,
lLoca.on('reset', this.plotPort, this); // notice () being removed after this.plotPort
lLoca.fetch(lOptions, this);
這將使用方法綁定reset
而不是調用它。
而關於從另一個調用一個方法,它非常簡單的,我們只是把它用this
,但如果呼叫正從一些回調函數或其他任何類似的事情在那里做this
並不是指來看,那么它的勸救參考this
是回調之前,並使用它時,需要回調。 例如,
var _view = this;
// doing collection fetch
this.collection.fetch({
success : function (collection, response) {
// if you want to access view here, it can be accessed using
// '_view' variable, because 'this' here does not point to the view.
}
});
這只是一個例子,但同樣的概念可以用於類似的問題。
我傾向於在初始化函數的開頭使用_.bindAll(this)
。
在初始化函數中嘗試這個
_.bindAll(this,'plotPort', 'plotLoc');
var lOptions = {};
lOptions.success = this.plotLoc;
lLoca.fetch(lOptions,this);
lLoca.on('reset', this.plotPort, this);
在一個對象內部,從一個函數調用另一個函數,你可以使用jQuery代理傳入正確的“this”
代替
this.plotPort();
嘗試
$.proxy(function () {
this.plotPort();
}, this);
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.