1

I'm trying to follow the example and getting the following error:

ERROR Error: Uncaught (in promise): Error: Template parse errors:
Can't bind to 'leafletOptions' since it isn't a known property of 'div'. ("
<div class="map"
leaflet
[ERROR ->][leafletOptions]="options">
</div>

This is my environment:

Angular CLI: 1.6.5
Node: 6.9.1
OS: linux x64
Angular: 5.2.1
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

@angular/cdk: 5.1.0
@angular/cli: 1.6.5
@angular/flex-layout: 2.0.0-beta.12
@angular/material: 5.1.0
@angular-devkit/build-optimizer: 0.0.41
@angular-devkit/core: 0.0.28
@angular-devkit/schematics: 0.0.51
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.9.5
@schematics/angular: 0.1.16
typescript: 2.5.3
webpack: 3.10.0

I'm assuming this has to be something simple, but this is my first time working with a recent version of angular.

pk.
  • 956
  • 7
  • 13

1 Answers1

1

So I found a solution.

I'm trying to create a separate module for my map and needed to add

import { LeafletModule } from '@asymmetrik/ngx-leaflet';

to my map module instead of to my app.component.ts. Hopefully this helps someone out in the future.

pk.
  • 956
  • 7
  • 13
  • Yep, that's what usually causes that error. It's kind of glossed over in the README that you need to import into the module that's using ngx-leaflet, not just the app module. – reblace Jan 23 '18 at 01:54