Javascript Angular js ng路线控制器不';行不通

Javascript Angular js ng路线控制器不';行不通,javascript,angularjs,google-maps-api-3,Javascript,Angularjs,Google Maps Api 3,我想使用AngularJSNg路线。加载页面时,将调用controllerMap。在这里,我有两个问题。第一个问题是当我调用controllerMap中的openemodal函数时,它不调用。第二个问题是当标记位置被更改时,调用addListener,并将url发送到正确的历史记录,但页面被刷新。我怎样才能解决这个问题 İndex页面: <html ng-app="exampleApp" ng-cloak="true"> <body> <div class=

我想使用AngularJS
Ng路线
。加载页面时,将调用
controllerMap
。在这里,我有两个问题。第一个问题是当我调用
controllerMap
中的
openemodal
函数时,它不调用。第二个问题是当标记位置被更改时,调用addListener,并将url发送到正确的历史记录,但页面被刷新。我怎样才能解决这个问题

İndex页面:

<html ng-app="exampleApp" ng-cloak="true">
<body>
    <div class="container-fluid">
        <div class="row">
            <div class="adrBody">
                <div class="adrHeader">
                    <div class="container-fluid">
                        <?php include_once('lib/view/userinfo.php'); ?>
                    </div>                          
                </div>
                <div ng-view class="adrCenter"></div>
                <div class="adrFooter" style="display:none !important;">
                    <?php include_once 'lib/view/footer.php'; ?>
                </div>            
            </div>
        </div>
    </div>
</body>

Map.php:

<div class="container-fluid" ng-controller="controllerMap">
   <div id="map" style="height: 100%;"></div>
</div>



var ngApp = angular.module('exampleApp', ["ngRoute"]);
window.ngApp.config(['$locationProvider', function ($locationProvider) {
    $locationProvider.html5Mode({
        enabled: true,
        requireBase: false
    });
}]);
window.ngApp.config(function ($routeProvider) {
$routeProvider.
    when('/', {
        templateUrl: 'lib/view/map.php',
        controller: 'controllerMap'
    }).
    when('/home', {
        templateUrl: 'lib/view/map.php',
        controller: 'controllerMap'
    }).
    when('/privacy', {
        templateUrl: 'lib/view/privacy.php'
    }).
    otherwise({
        templateUrl: 'lib/view/404.php'
    });
});

window.ngApp.controller('controllerMap', ["$rootScope", '$scope', '$location', '$window', '$filter', function ($rootScope, $scope, $location, $window, $filter) {
    $scope.init = function () {
        $scope.lat = $location.search().lat ? $location.search().lat : 75.6744698;
        $scope.lng = $location.search().lng ? $location.search().lng : 85.57337;
        $scope.zoom = $location.search().zoom ? parseInt($location.search().zoom) : 19;
        $scope.latlng = new google.maps.LatLng($scope.lat, $scope.lng);
        $scope.map = new google.maps.Map(document.getElementById('map'), {
            center: $scope.latlng,
            zoom: $scope.zoom
        });

        $scope.marker = new google.maps.Marker({
            map: $scope.map,
            position: $scope.latlng,
            draggable: true,
            icon: 'assets/img/pin-4ldpi.png'
        });

        $scope.map.setCenter($scope.latlng);
        $scope.marker.setPosition($scope.latlng);

        google.maps.event.addListener($scope.map, 'idle', function (event) {
            history.pushState(null, null, "?lat=" + $scope.lat + "&lng=" + $scope.lng + "&zoom=" + $scope.map.getZoom());
            $scope.zoom = $scope.map.getZoom();
        });

    }

    $scope.openEmModal = function ($event) {            
        if ($event) {
            $scope.lat = $($event.currentTarget).data("lat");
            $scope.lng = $($event.currentTarget).data("lng");
        }
        $("#orderEmModal").modal("show");
    }        

    $scope.init();
}])

var ngApp=angular.module('exampleApp',[“ngRoute”]);
window.ngApp.config(['$locationProvider',函数($locationProvider){
$locationProvider.html5模式({
启用:对,
requireBase:错误
});
}]);
window.ngApp.config(函数($routeProvider){
$routeProvider。
当(“/”{
templateUrl:'lib/view/map.php',
控制器:“控制器映射”
}).
当(“/home”{
templateUrl:'lib/view/map.php',
控制器:“控制器映射”
}).
当(“/隐私”{
templateUrl:'lib/view/privacy.php'
}).
否则({
templateUrl:'lib/view/404.php'
});
});
controller('controllerMap',[“$rootScope”,'$scope','$location','$window','$filter',函数($rootScope,$scope,$location,$window,$filter){
$scope.init=函数(){
$scope.lat=$location.search().lat?$location.search().lat:75.6744698;
$scope.lng=$location.search().lng?$location.search().lng:85.57337;
$scope.zoom=$location.search().zoom?parseInt($location.search().zoom):19;
$scope.latlng=新的google.maps.latlng($scope.lat,$scope.lng);
$scope.map=new google.maps.map(document.getElementById('map'){
中心:$scope.latlng,
zoom:$scope.zoom
});
$scope.marker=new google.maps.marker({
map:$scope.map,
职位:$scope.latlng,
真的,
图标:“assets/img/pin-4ldpi.png”
});
$scope.map.setCenter($scope.latlng);
$scope.marker.setPosition($scope.latlng);
google.maps.event.addListener($scope.map,'idle',function(event){
history.pushState(null,null,“?lat=“+$scope.lat+”&lng=“+$scope.lng+”&zoom=“+$scope.map.getZoom());
$scope.zoom=$scope.map.getZoom();
});
}
$scope.openEmModal=函数($event){
如果($事件){
$scope.lat=$($event.currentTarget).data(“lat”);
$scope.lng=$($event.currentTarget).data(“lng”);
}
美元(“#orderemodal”).modal(“show”);
}        
$scope.init();
}])

不要在angularjs中使用PHP和jQuery。AngularJS可以像PHP一样呈现模板/部分,并且可以使用指令(使用jQLite)而不是jQuery修改DOM<代码>HTML5模式将中断您的路由,因此您需要在服务器端对其进行配置
controllerMap
现在是一个单独的模块,您需要使用
angular.module('exampleApp',[“ngRoute”,“controllerMap”])注入它。
这里的问题是没有调用$scope.OpeneModal(),正如您所说,我尝试过,但得到了一个错误。controllerMap只调用了一次。以后我再也不能用了。