-1
Я довольно новичок в работе над угловыми работами. Я пытаюсь добавить карту на свои страницы, используя Листовку. Я хотел бы сделать это через компоненты. Я выполнил две инструкции (перечисленные в комментарии), чтобы это произошло (зря).Использование листовки в угловых компонентах
Вы можете увидеть результат здесь: http://oye-api.herokuapp.com/test.html
Но у меня нет ничего. Нет карты, но нет ошибок. Я не знаю, что я сделал неправильно. Вы можете помочь?
Спасибо!
Это то, что у меня есть:
page.html
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css" />
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-route/angular-route.js"></script>
<script src="bower_components/angular-resource/angular-resource.js"></script>
<script src="bower_components/angular-mocks/angular-mocks.js"></script>
<script src="app.module.js"></script>
<script src="map/map.module.js"></script>
<script src="map/map.component.js"></script>
<map></map>map.component.js
angular.
module('map').
component('map', {
templateUrl: 'map/map.template.html',
controller: MapController
}
);
MapController.$inject = ['$scope'];
function MapController($scope) {
var ctrl = this;
angular.extend(ctrl, {
san_fran: {
lat: 37.78,
lng: -122.42,
zoom: 13
},
events: {},
layers: {
baselayers: {
osm: {
name: 'OpenStreetMap',
url: 'https://{s}.tiles.mapbox.com/v3/examples.map-i875mjb7/{z}/{x}/{y}.png',
type: 'xyz'
}
}
},
defaults: {
scrollWheelZoom: false
}
});
}map.template.html
<leaflet center="san_fran" markers="markers" event-broadcast="events" defaults="defaults" id='map'></leaflet>app.module.js
'use strict';
angular.module('oyeApp', [
'ngRoute',
'map'
]);map.module.js
'use strict';
angular.module('map', [
'ngRoute'
]);
инструкции я пытался следовать: - http://blog.thehumangeo.com/angular -component-syntax.html - https://coderwall.com/p/cfj6da/how-to-use-the-angular-leaflet-directive –