II实施了一个地图,用于显示来自标记的客户。我使用的地图是Leaflet,其中directive代表AngularJS。
我的问题是,当我第一次访问地图时,它正常工作,当我更改路线时,它会删除所有标记,返回地图屏幕,它会在没有标记的情况下加载,并且仅在我重新加载时显示它们页。
$ Window.location.reload()函数。
所以当我访问地图所在的页面时,我有了使用$ window.location.reload()的想法。当我单击指向地图的页面的菜单图标(快捷方式)时,我调用该函数,并重新加载页面再次显示标记。
vm.recarregarRota = function (){
$window.location.reload();
}
查看:这是加载地图的代码。
<div class="col-md-12 box_map" style="padding: 20px 30px 20px 30px;">
<div id="recent_activity" class="box_whiteframe_map">
<leaflet defaults="vm.defaults" lf-center="vm.center" ng-init="vm.buscaEnderecoClientesEmpresas()" markers="vm.markers" width="100%" height="480px"></leaflet>
</div>
控制器:在控制器中是用于加载DB数据并将其分配给标记的功能。我也在这个函数中创建标记。并扩展地图的属性,比如说它的起始位置就是这样的坐标。
vm.markers = new Array(); //CRIA MARKERS A SEREM UTILIZADOS NO MAP
vm.buscaEnderecoClientesEmpresas = function() { //Function used to load DB data and assign to bookmarks. It is also in this function that I create the bookmarks ....
vm.items.then(function(items) { // Read array of return
relatoriosService.carregarEnderecoClientesEmpresas(dados).then(function(response) {
if (response.data != 'null') {
vm.enderecoClientesEmpresas = response.data; //return array
angular.forEach(vm.enderecoClientesEmpresas, function(value, key) { //FOREACH UTILIZADO PARA PERCORRER ARRAY
vm.markers.push({
group: value.estado, //DATA FROM THE BD.
lat: value.latitude, //DATA FROM THE BD.
lng: value.longitude, //DATA FROM THE BD.
message: "teste",
icon: {
type: 'awesomeMarker',
prefix: 'fa',
icon: icon,
markerColor: color
},
label: {
options: {
noHide: true
}
}
});
});
} else {
vm.enderecoClientesEmpresas = '';
}
}, function(error) {
console.log('Erro findSemEmail: ', error);
});
});
}
angular.extend(vm, { //
EXTEND THE PROPERTIES OF THE MAP (MARKERS, INCIAL LOCATION ..)
center: { //
INITIAL LOCATION.
lat: -27.952419,
lng: -52.211667,
zoom: 6
},
defaults: { //
LAYER IS THE TYPE OF MAP TO BE USED
tileLayer: "http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png",
zoomControlPosition: 'topright',
tileLayerOptions: {
opacity: 0.9,
detectRetina: true,
reuseTiles: true,
attribution: '© <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> | © <a href="http://www.openstreetmap.org/copyright">Funil PRÓ</a>',
},
}
});
我的问题如下,当用户使用浏览器后退箭头而不是使用系统快捷方式导航时,页面将不会重新加载,如果使用此表单,有一种方法可以重新加载页面吗? / p>
或者当您访问特定路线时重新加载页面。
答案 0 :(得分:0)
&#34;或者当您访问特定路线时重新加载页面。&#34;
是的,您可以使用$routeChange
事件来访问它:
$rootScope.$on("$routeChangeStart", function(event, next, current) {
var urlFrom = current.$$route.originalPath; // Page you are coming from
var urlTo = next.$$route.originalPath; // Page you are going to
});
别忘了在模块中注入$rootScope
和$window
。