javascript - 返回页面后不显示 Angular 指令

标签 javascript html angularjs

我正在编写一个 Ionic 应用程序,但我在使用自定义指令元素时遇到了问题。

这是我的问题的简化代码笔 http://codepen.io/anon/pen/zGJRQg

angular.module('ionicApp',[
  'ionic'
])

.directive('map', function() {
    return {
        restrict: 'A',
        replace: true,
        link: function(scope, element, attributes) {

            function drawMap(position) {

                var myLatlng = new google.maps.LatLng(position.latitude, position.longitude);

                var mapOptions = {
                    center: myLatlng,
                    zoom: 15,
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                };

                var map = new google.maps.Map(document.getElementById("map"), mapOptions);

                scope.marker = new google.maps.Marker({
                    position: myLatlng,
                    map: map
                });

                scope.map = map;
            }

            function updateMap(position) {
                var newPosition = new google.maps.LatLng(position.latitude, position.longitude);
                scope.marker.setPosition(newPosition);
                scope.map.panTo(newPosition);
            }

            var position = {
        coords: {
          latitude: 50.2440218,
          longitude: 5.2807709
        }
      };

            scope.currentPosition = position.coords;

      if (!scope.map) {
        drawMap(position.coords);
      } else {
        updateMap(position.coords);
      }

            scope.$on('$destroy', function() {
                watch.clearWatch();
            });


        },
        template: '<div style="width: 100%; height: 280px;" id="map" data-tap-disabled="true"></div>'
    }
});

如果您点击“搜索工作代码”按钮,您将进入搜索页面。当您在此页面上时,如果您单击左上角的后退按钮,第一页上的 map 仍显示为确定。但是,如果您单击“选择职位代码”按钮,您将被重定向回原始页面,但 map 不可见。

谁能告诉我哪里出了问题以及如何解决?

感谢您的帮助

编辑:我注意到如果我不包含任何参数,就像这样:

$scope.selectJobCode = function(jobCode) {
    $state.go('app.jobs');
};

然后该指令将保持完整并正常工作。但是,一旦我随状态更改发送参数,该指令就不再起作用:

$scope.selectJobCode = function(jobCode) {
    $state.go('app.jobs', {
        jobCode: jobCode
    });
};

最佳答案

抱歉我不能写评论。所以我认为你的问题是关于

<ion-view view-title="Jobs Search">

<ion-view view-title="Jobs">

您的第一个标签和最后一个标签具有相同的标题。也许您可以尝试更改其中一个。我认为您的后退按钮正在使用 View 标题导航。

关于javascript - 返回页面后不显示 Angular 指令,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31581203/

相关文章:

javascript - 如何在 webstorm 中使用 angular js

html - 同一页面中的多个 CSS 折叠/展开

javascript - Angular JS : URL parameter appears before the `#!/` and doesn't appear in $location. 搜索()

从 API 下载 AngularJS CSV 文件

javascript - 在 ExtJS 中,如何向数据网格行添加自定义 CSS 类?

html - 无法让颜色叠加工作。我错过了什么?

html - 不用 JavaScript 替换元素

javascript - 以编程方式(或可选地)覆盖 Chrome 的新标签页

javascript - 奇怪的 JavaScript 语法,看起来像 Python 元组

javascript - 平滑的 anchor /ID 滚动不适用于标题的偏移量