$ Window.location.reload()函数

时间:2017-01-16 12:32:51

标签: javascript angularjs

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: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> | &copy <a href="http://www.openstreetmap.org/copyright">Funil PRÓ</a>',
            },
        }
    });

我的问题如下,当用户使用浏览器后退箭头而不是使用系统快捷方式导航时,页面将不会重新加载,如果使用此表单,有一种方法可以重新加载页面吗? / p>

或者当您访问特定路线时重新加载页面。

1 个答案:

答案 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