Declare AngularOpenlayersModule in other module

[reservoir-dogs]

My application display a map correctly with this simple snippet.

<aol-map [width]="'500px'" [height]="'300px'">
   <aol-view [zoom]="2">
       <aol-coordinate [x]="5.795122" [y]="45.210225" [srid]="'EPSG:4326'"></aol-coordinate>
   </aol-view>
   <aol-layer-tile>
       <aol-source-osm></aol-source-osm>
   </aol-layer-tile>
</aol-map>

Next, my goal is to mock the map when I use ssr.

First step, I would declare AngularOpenlayersModule in second module of my application like that

// app.browser.module.ts
import { NgModule } from '@angular/core';
import { AppModule } from './app.module';
import { AngularOpenlayersModule } from 'ngx-openlayers';
import { AppComponent } from './app.component';
@NgModule({
  imports: [
    AppModule,
    AngularOpenlayersModule
  ],
  bootstrap: [AppComponent]
})
export class AppBrowserModule { }

My default module is

// app.module.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule, NO_ERRORS_SCHEMA } from '@angular/core';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { MapComponent } from './map/map.component';

@NgModule({
  declarations: [
    AppComponent,
    MapComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
  ],
  providers: []
})
export class AppModule { }

I change the main.ts like that

import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

import { AppBrowserModule } from './app/app.browser.module';
import { environment } from './environments/environment';

if (environment.production) {
  enableProdMode();
}

platformBrowserDynamic().bootstrapModule(AppBrowserModule)
  .catch(err => console.error(err));

When I execute, it seems that it doesn't know the MapComponent

compiler.js:2547 Uncaught Error: Template parse errors:
Can't bind to 'width' since it isn't a known property of 'aol-map'.
1. If 'aol-map' is an Angular component and it has 'width' input, then verify that it is part of this module.
2. If 'aol-map' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. ("<aol-map [ERROR ->][width]="'500px'" [height]="'300px'">
   <aol-view [zoom]="2">
       <aol-coordinate [x]="5.795122"): ng:///AppModule/MapComponent.html@0:9
Can't bind to 'height' since it isn't a known property of 'aol-map'.
1. If 'aol-map' is an Angular component and it has 'height' input, then verify that it is part of this module.
2. If 'aol-map' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. ("<aol-map [width]="'500px'" [ERROR ->][height]="'300px'">
   <aol-view [zoom]="2">
       <aol-coordinate [x]="5.795122" [y]="45.210225" "): ng:///AppModule/MapComponent.html@0:27

Do you have any idea ?

[MarouaniALA]

Hi @reservoir-dogs ,
Did you solve this issue?