AOT compilation error: Function calls are not supported in decorators but 'JsonSchemaFormModule' was called.

Issue type

I’m submitting a (check one): [x ] Bug report [ ] Feature request [ ] Regression (something that used to work, but stopped working in a newer version) [ ] Support request [ ] Documentation issue or request

Prerequisites

Before posting, make sure you do the following (check all): [x ] Confirm you are using the latest versions of all necessary packages (or if not, explain why not) [ x] Search GitHub for a similar issue or PR [ x] If submitting a Support request, also search [Stack Overflow][stack-overflow] for similar issues Note: Please cross-post GitHub support requests to [Stack Overflow][stack-overflow], and include a link in your GitHub issue to your Stack Overflow question. We do currently respond to support requests on GitHub, but we eventually expect to stop, and will then refer all support questions exclusively to Stack Overflow.

Current behavior

On AOT compilation i have this error: Error: Error during template compile of 'AppModule' Function calls are not supported in decorators but 'JsonSchemaFormModule' was called.

import { JsonSchemaFormModule, MaterialDesignFrameworkModule } from 'angular2-json-schema-form';

@NgModule({
  declarations: [ AppComponent ],
  imports: [
    BrowserModule, MaterialDesignFrameworkModule,
    JsonSchemaFormModule.forRoot(MaterialDesignFrameworkModule)
  ],
  providers: [],
  bootstrap: [ AppComponent ]
})

Expected behavior

AOT build working

IMPORTANT: How can we reproduce your problem?

Try to aot build app with angular2-json-schema-form on angular version 5.2.1.

Environment

OS name & version: Windows 10 Browser name & version: Chrome Angular version: 5.2.1 Angular JSON Schema Form version(s): 0.7.0-alpha.1

[viktor25]

This workaround fixes AOT for me. In your application module, replace

JsonSchemaFormModule.forRoot(MaterialDesignFrameworkModule)

with

{
    ngModule: JsonSchemaFormModule,
    providers: [
        JsonSchemaFormService,
        FrameworkLibraryService,
        WidgetLibraryService,
        {provide: Framework, useClass: MaterialDesignFramework, multi: true}
    ]
}

This is for version 0.7.0-alpha.1. You can see what JsonSchemaFormModule.forRoot expands to by looking in json-schema-form.module.ts.

[stalsma]

I’m posting my code here as an example that implements the fix. I have a dedicated module that wraps this module, so that I can share it across other feature modules. Note that I’m using bootstrap instead of Material.

Running Angular CLI: 1.6.6, Angular 5.2

import {ModuleWithProviders, NgModule} from '@angular/core';
import {CommonModule} from '@angular/common';
import {JsonSchemaFormModule, Bootstrap4FrameworkModule, Framework, WidgetLibraryService, FrameworkLibraryService, JsonSchemaFormService} from 'angular2-json-schema-form';
import {BrowserModule} from '@angular/platform-browser';

@NgModule({
    imports: [
        CommonModule,
        BrowserModule,
        Bootstrap4FrameworkModule,

        {
            ngModule: JsonSchemaFormModule,
            providers: [
                JsonSchemaFormService,
                FrameworkLibraryService,
                WidgetLibraryService,
                {provide: Framework, useClass: Bootstrap4FrameworkModule, multi: true}
            ]
        }
    ],
    declarations: [DynamicFormComponent, FormsListComponent],
    exports: [DynamicFormComponent, FormsListComponent]
})

export class DynamicFormsModule {
}