只运行一次meteor.js代码

Question

我想在Template.foo.rendered中只运行一次代码。我有一个Leaflet地图和一个集成的定位控制插件。它迄今为止效果很好，但似乎渲染的模板经常重新运行。因此，我的标记用于在地图上定位用户每隔几秒就会重置一次。我只想初始化一次。

var map, mapInit; 
    map = void 0; 

    mapInit = function (element){ 

     map = L.mapbox.map(element, 'examples.map-20v6611k').setView(new L.LatLng(52.02312,13.02627), 11); 
     L.control.locate({drawCircle: true, position: 'topright'}).addTo(map); 

    } 

    Template.map.rendered = function() { 
    $(window).resize(function() { 
     var h = $(window).height(); 
     $mc = $('#map'); 
     $mc.css('height', h); 
    }).resize(); 

    if (!this.rendered) { 
     mapInit('map'); 
     this.rendered = true; 
    } 
    } 

Answer 1

您可能要到地图的DOM元素保存到一个全局或应用程序变量（在这里，Map），后来在DOM重新插入：

var Map; 

... 

var mapDomElement = $('#map'); 
if (Map.domElements) { 
    mapDomElement.replaceWith(Map.domElements); 
} else { 
    Map.mapObject = L.mapbox.map(...) // instantiate map here 
    Map.domElements = mapDomElement; 
} 

注重。高度重新计算：你不需要那样做。使用CSS弹性盒模型，以最大限度地地图高度：

<div style="display: flex; flex-flow: column; min-height: 100%"> 

    <div id="map" style="flex: 1"></div> 

    <div> 
    ... map controls here 
    </div> 
</div> 

见this answer在柔性模型。 “东西在这里”div是你的地图。