I have a custom directive that requires the leaflet directive so I can access the controller:
restrict: 'E',
require: '^leaflet',
scope: {
},
template: "",
link: function(scope, element, attrs, controller) {
}
When I use my custom directive in my app's controller without implementing ng-repeat
it works fine. Like this:
controller's HTML without ng-repeat
<leaflet defaults="defaults" center="center" markers="markers" layers="layers" paths="paths">
<ng-include src="/markers.html" />
<my-directive
waypoints="wps">
</my-directive>
</leaflet>
controller's JS without ng-repeat
$scope.wps = [[32.745,-117.2776],[32.693,-117.3188]];
However, when I try to add ng-repeat
I end up getting the following error:
Error: [$compile:ctreq] http://errors.angularjs.org/1.3.12/$compile/ctreq?p0=leaflet&p1=myDirective
controller's HTML with ng-repeat
<leaflet defaults="defaults" center="center" markers="markers" layers="layers" paths="paths">
<ng-include src="/markers.html" />
<my-directive
ng-repeat="(name, data) in routes"
name="{{ name }}"
waypoints="data.wps">
</my-directive>
</leaflet>
controller's JS with ng-repeat
$scope.routes = {
r1: {
wps: [[32.745,-117.2776],[32.693,-117.3188]]
}
}
What have I screwed up?
You have
<ng-include src="/markers.html" />
before your directive. You need to explicitly close that tag. See this bug report.