Search code examples
ngx-leaflet

Template parse errors - leafletOptions

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.

Solution

  • 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.