2015-10-26 27 views
0

我正在使用angular-Leaflet-directive在我的应用程序中创建自定义地图。我能够得到一个简单的地图到我的ng-view中,但是当我使用.extend时,我得到app.extend不是我的控制台日志中的一个函数。以下是我的地图控制器。。扩展不是函数吗?我使用角度和传单

var app = angular.module('myApp', ['ngRoute', 'nemLogging', 'leaflet-directive']); 
app.controller('HomeController',['$scope', function($scope) { 
app.extend($scope, { 
    center: { 
     lat: 44.97, 
     lng: 93, 
     zoom: 15 
    } 
}); 
}]); 

这里是我的HTML地图将被追加到。这将在我的ng-view中。

<body ng-controller='HomeController'> 

<leaflet center="center" width="100%" height="480"></leaflet> 

</body> 

这是我的主要索引文件,我正在寻找和创建我的ng视图。

<!DOCTYPE html> 
<html lang="en" ng-app="myApp" class="ng-scope"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Venue review</title> 
    <link rel="stylesheet" href="/stylesheets/index.css"> 
    <link href='https://api.mapbox.com/mapbox.js/v2.2.2/mapbox.css' rel='stylesheet' /> 
    <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet/v0.7.7/leaflet.css" /> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" /> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css" /> 
    <script src="/vendors/angular/angular.min.js"></script> 
    <script src="/vendors/angular-route/angular-route.min.js"></script> 
    <script src="/vendors/angular-simple-logger/dist/angular-simple-logger.min.js"></script> 
    <script src="http://cdn.leafletjs.com/leaflet/v0.7.7/leaflet.js"></script> 
    <script src="/vendors/angular-leaflet-directive/dist/angular-leaflet-directive.min.js"></script> 
    <script src="/javascripts/client.js"></script> 
    <script src="/javascripts/HomeController.js"></script> 
    <script src="/javascripts/RegisterController.js"></script> 
    <script src="/javascripts/VenueController.js"></script> 
    <script src="/javascripts/LoginController.js"></script> 
    <base href="/"> 
</head> 
<header> 
    <nav class="navbar navbar-default"> 
     <div class="container"> 
      <div class="navbar-header"> 
       <a class="navbar-brand" href="/">Venue</a> 
      </div> 

      <ul class="nav navbar-nav navbar-right"> 
       <li><a href="/"><i class="fa fa-home"></i> Home</a></li> 
       <li><a href="/venuePage"><i class="fa fa-music"></i> Venues</a></li> 
       <li><a href="/register"><i class="fa fa-user-plus"></i> Register</a></li> 
       <li><a href="/login"><i class="fa fa-sign-in"></i> Log In</a></li> 
      </ul> 
     </div> 
    </nav> 

</header> 



<div id="main"> 
    <ng-view> 

    </ng-view> 

    <footer class="footer"> 
     <div class="container"> 
      <p class="text-muted">Place sticky footer content here.</p> 
     </div> 
    </footer> 

</div> 
</body> 
</html> 

回答

0

你需要调用扩展angular对象上不上你的应用程序实例app

angular.extend($scope, { 
    center: { 
     lat: 44.97, 
     lng: 93, 
     zoom: 15 
    } 
}); 

https://docs.angularjs.org/api/ng/function/angular.extend

+0

谢谢!它的工作 –

+0

不,谢谢,你总是欢迎。这就是Stackoverflow的用处;)但是,您可以考虑将答案标记为已接受,以便其他具有类似问题的用户也可以找到可接受的解决方案。请参阅:stackoverflow.com/help/someone-answers祝您好运,欢迎来到Stackoverflow :) – iH8