Implementing the theme service

The theme service has the responsibility of retrieving the dynamic theme settings.

Let's start with a simple implementation by using localStorage. In this implementation, we will also provide default settings if the value is not available:

import { Injectable } from '@angular/core';
@Injectable({
  providedIn: 'root',
})
export class ThemeService {
  constructor() {} 
  public setSetting(name: string, value: string): void {
    localStorage.setItem(name, value);
  } 
  public getSetting(name: string): string {
    switch (name) {
      case 'background':
        return localStorage.getItem(name) || 'yellow';
      case 'tileBackground':
        return localStorage...