ERROR in Error encountered resolving symbol values statically. in appmodule in angular

Question

I am trying to read a config file in angular before the app starts. I have encountered a solution but i keep getting an error when i use the commang ng serve for the first time. Then i re save the code and webpack compiles successfully with no errors. And the code works fine. The error is

ERROR in Error encountered resolving symbol values statically. Function calls are not supported. Consider replacing the function or lambda with a reference to an exported function (position 117:45 in the original .ts file), resolving symbol AppModule in C:/Repo/rvm-web-ui/AdaRvmWebClient/src/app/app.module.ts

The line i added to appmodule.ts

 AppConfig,
    { provide: APP_INITIALIZER, useFactory: (config: AppConfig) => () => config.load(), deps: [AppConfig], multi: true },

And the appconfig file

import { Inject, Injectable } from '@angular/core';
import { Http } from '@angular/http';
import { Observable } from 'rxjs/Rx';
import { ConnectionHelper } from 'app/config/connections';

@Injectable()
export class AppConfig {

    private config: Object = null;
    private env:    Object = null;

    constructor(private http: Http) {

    }

    /**
     * Use to get the data found in the second file (config file)
     */
    public getConfig(key: any) {
        return this.config[key];
    }

    /**
     * Use to get the data found in the first file (env file)
     */
    public getEnv(key: any) {
        return this.env[key];
    }

    /**
     * This method:
     *   a) Loads "env.json" to get the current working environment (e.g.: 'production', 'development')
     *   b) Loads "config.[env].json" to get all env's variables (e.g.: 'config.development.json')
     */
    public load() {
        return new Promise((resolve, reject) => {
            this.http.get('conf/env.json').map( res => res.json() ).catch((error: any):any => {
                console.log('Configuration file "env.json" could not be read');
                resolve(true);
                return Observable.throw(error.json().error || 'Server error');
            }).subscribe( (envResponse:any) => {
                this.env = envResponse;
                let request:any = null;

                switch (envResponse.env) {
                    case 'production': {
                        request = this.http.get('conf/config.' + envResponse.env + '.json');
                    } break;

                    case 'development': {
                        request = this.http.get('conf/config.' + envResponse.env + '.json');
                    } break;

                    case 'default': {
                        console.error('Environment file is not set or invalid');
                        resolve(true);
                    } break;
                }

                if (request) {
                    request
                        .map( res => res.json() )
                        .catch((error: any) => {
                            console.error('Error reading ' + envResponse.env + ' configuration file');
                            resolve(error);
                            return Observable.throw(error.json().error || 'Server error');
                        })
                        .subscribe((responseData:any) => {
                            ConnectionHelper.SERVER_IP = responseData.server;
                            ConnectionHelper.SERVER_PORT = responseData.port;
                            ConnectionHelper.SERVER_URL = ConnectionHelper.SERVER_IP+":"+ConnectionHelper.SERVER_PORT+ConnectionHelper.ADA_URL;
                            resolve(true);
                        });
                } else {
                    console.error('Env config file "env.json" is not valid');
                    resolve(true);
                }
            });

        });
    }
}

score 0 · Accepted Answer · answered Oct 12 '17 at 08:09

Looks like using function definition or lamda functions are deprecated. I needed extract the function from app module and define it like below in AppConfig.ts (You can define it in any file)

export function initConfig(config: AppConfig){
    return () => config.load() 
   }

Then changed the app module

 AppConfig,
    { provide: APP_INITIALIZER, useFactory: initConfig, deps: [AppConfig], multi: true },

I hope this helps someone

ERROR in Error encountered resolving symbol values statically. in appmodule in angular

1 Answers1