Leaflet map doesn't load with angular-leaflet-directive

Question

I directly copied and pasted the source code, from this webpage, onto my compiler: http://tombatossals.github.io/angular-leaflet-directive/examples/0000-viewer.html#/basic/first-example

I included the following source files within my HTML file :

<script src="../bower_components/angular/angular.min.js"></script>
<script src="../bower_components/leaflet/dist/leaflet.js"></script>
<script src="../dist/angular-leaflet-directive.min.js"></script>
<link rel="stylesheet" href="../bower_components/leaflet/dist/leaflet.css" />

<script src="http://tombatossals.github.io/angular-leaflet-directive/bower_components/angular/angular.min.js"></script>
<script src="http://tombatossals.github.io/angular-leaflet-directive/bower_components/leaflet/dist/leaflet.js"></script>
<script src="http://tombatossals.github.io/angular-leaflet-directive/dist/angular-leaflet-directive.min.js"></script>
<link rel="stylesheet" href="https://angular-ui.github.io/ui-leaflet/bower_components/leaflet/dist/leaflet.css"/>

The map doesn't load, as seen in this image below:

Answer 1

Before using angular-leaflet-directive, you must include some files to your project (.css and .js).

Try to follow those steps :