README

Angular Firebase Remote Config Provider for NG-CONFIG

Google Firebase Remote Config integration of DagonMetric/ng-config for Angular applications.

Get Started

Installation

npm

npm install @dagonmetric/ng-config @dagonmetric/ng-config-firebase-remote-config

or yarn

yarn add @dagonmetric/ng-config @dagonmetric/ng-config-firebase-remote-config

Latest npm package is

Module Setup (app.module.ts)

import { ConfigModule } from '@dagonmetric/ng-config';
import { FirebaseRemoteConfigProviderModule } from '@dagonmetric/ng-config-firebase-remote-config';

@NgModule({
  imports: [
    // Other module imports

    // ng-config modules
    ConfigModule.configure(true, {
      debug: true
    }),
    FirebaseRemoteConfigProviderModule.configure({
        firebaseConfig: {
            apiKey: '<your_firebase_api_key>',
            projectId: 'your_firebase_project_id',
            appId: 'your_firebase_app_id'
        },
        remoteConfigSettings: {
            minimumFetchIntervalMillis: 43200000
        },
        prefix: 'myAppPrefix_'
    })
    // And additional config provider imports...
  ]
})
export class AppModule { }

Edit app.module.ts in stackblitz

Usage

import { Component } from '@angular/core';

import { ConfigService } from '@dagonmetric/ng-config';

export class AppOptions {
  name = '';
  lang = '';
  logEnabled = false;
  logLevel = 0;
}

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html'
})
export class AppComponent {
  constructor(private readonly configService: ConfigService) {
    // Get with key
    const configValue = this.configService.getValue('key1'));
    console.log('value: ', configValue);

    // Get with options class
    const appOptions = this.configService.mapType('app', AppOptions));
    console.log('appOptions: ', JSON.stringify(appOptions));

    // Call reload to get the fresh config values from providers
    // this.configService.reload().subscribe(() => {
    //   console.log('Reloaded');
    // });

    // Configuration value change detection
    // This will only trigger when reload() is called and
    // any value changes
    this.configService.valueChanges.subscribe(() => {
      const latestValue = this.configService.getValue('key1'));
      console.log('latest value: ', latestValue);

      const lastestOptions = this.configService.mapType('app', AppOptions));
      console.log('lastest appOptions: ', lastestOptions);
    });
  }
}

Edit app.component.ts in stackblitz

Samples

Demo app view source / live edit in stackblitz

Related Projects

ng-config - The core configuration & options service for Angular applications
ng-log - Vendor-agnostic logging, analytics and telemetry service abstractions and some implementations for Angular applications
ng-log-firebase-analytics - Firebase Analytics implementation for ng-log
ng-cache - Caching service for Angular applications

Build & Test Tools

We use lib-tools for bundling, testing and packaging our library projects.

Feedback and Contributing

Check out the Contributing page.

License

This repository is licensed with the MIT license.

Usage no npm install needed!