Question

这是单页应用。有我需要的东西 https://github.com/tombatossals/angular-leaflet-directive/blob/master/examples/simple-example.html

但我想添加菜单......

<html ng-app="App">
<head>
<link rel="stylesheet" href="//.../bootstrap.min.css" />
<link rel="stylesheet" href="//.../bootstrap.css" />
<link rel="stylesheet" href="//.../font-awesome.css" />
<script src="http://.../leaflet.js"></script>
<script src="http://...1.2.6/angular.min.js"></script>
<script src="angular-leaflet-directive.min.js"></script>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.1/leaflet.css">
    <script>
    var App = angular.module('App', ['leaflet-directive']);

    App.config(function ($routeProvider, $locationProvider) {
        $locationProvider.html5Mode(true);
        $routeProvider

            .when('/', {
                templateUrl: 'pages/home.html',
                controller: function ($scope) {
                }
            })

            .when('/about', {
                templateUrl: 'pages/about.html',
                controller: function ($scope) {
                }
            });
    });

</script>

home.html和about.html由

组成

</head>
<body >
<nav class="navbar navbar-default navbar-static-top">
        <ul class="nav navbar-nav">
            <li><a href="/"> home</a></li>
            <li><a href="/about"> about</a></li>
        </ul>
</nav>

    <div ng-view></div>
</body>
</html>

感谢!!!

Answer 1

要路由到工作，您需要确保注入ngRoute：

<script type="text/javascript" src="angular-route.min.js"></script>

var App = angular.module('App', ['leaflet-directive', 'ngRoute']);

我建议在开始添加其他指令之前让路由工作。

使用$ routeProvider的Angular OpenStreetMap

1 个答案: