if (href) {
    result += `<a class="${className}-link" href="${href}">`;
} else {
    result += `<a class="${className}-link">`;
}

for (let i = 0, len = data.length; i < len; i++) {
    const el = data[i];
    const { level, id, text } = el;
    const href = id ? `#${encodeURL(id)}` : null;
 	//...
}

console.log(data)
for (let i = 0, len = data.length; i < len; i++) {
    const el = data[i];
    const { level, id, text } = el;
    const href = id ? `#${encodeURL(id)}` : null;
 	//...
}

[
  { text: '使用Firebase', id: '', level: 1 },
  { text: '前言', id: '', level: 1 },
  { text: '安裝', id: '', level: 1 },
  { text: 'Using Firebase via CDN', id: '', level: 2 },
  { text: 'Using Firebase via NPM', id: '', level: 2 },
  { text: '實作', id: '', level: 1 },
  { text: '在Angular使用Firebase', id: '', level: 2 },
  { text: '自訂FirebaseAuth介面', id: '', level: 2 }
]

for (let i = 0, len = data.length; i < len; i++) {
    let encodedText = function(txt){
      let new_txt = String(txt).toLowerCase().replace(/ /g, "-");
      console.log(new_txt)
      return new_txt;
    }
    const el = data[i];
    const { level, id, text } = el;
    // const href = id ? `#${encodeURL(id)}` : null;
    const href = text ? `#${encodedText(text)}` : null;
    //...
}

var firebase = require('firebase');
var firebaseui = require('firebaseui');

import firebase from 'firebase/app';
import * as firebaseui from 'firebaseui';

import firebase from 'firebase/app';
import * as firebaseui from 'firebaseui';
import { firebaseConfig } from '../xxx_config';

export class LoggingPageComponent implements OnInit {

    constructor() {}
    
    @Input() firebaseConfig: object;

    ngOnInit(): void {
        // const firebase = globalThis.firebase;
        // const firebaseui = globalThis.firebaseui;
        firebase.initializeApp(firebaseConfig);
        var ui = new firebaseui.auth.AuthUI(firebase.auth());
        //...
        var uiConfig = {
            //...
            signInSuccessUrl: '/setting',
        }
        ui.start('#firebaseui-auth-container', uiConfig);
        
    }    
    
}

// tailwind.config.js
module.exports = {
  purge: {
    // enabled: true,
    content: [
      './src/**/*.html',
      './src/**/*.ts',
      './projects/**/*.html',
      './projects/**/*.ts'
    ]
  },
}

purge: {
    // enabled: true,
    content: [
      './src/**/*.html',
      './src/**/*.ts',
      './projects/**/*.html',
      './projects/**/*.ts'
    ]
  },

module.exports = {
  theme: {
    extend: {
      colors: {
        transparent: 'transparent',
        current: 'currentColor',
        indigo: {
          light: '#211EAD',
          DEFAULT: '#21156D',
          dark: '#21156D',
        },
        green: {
          light: '#2EC5CE'
        }
      }
    },
  }
}

module.exports = {
  // darkMode: false, // or 'media' or 'class'
  darkMode: 'class', // or 'media' or 'class'
}

module.exports = {
  purge: {
    // enabled: true,
    content: [
      './src/**/*.html',
      './src/**/*.ts',
      './projects/**/*.html',
      './projects/**/*.ts'
    ]
  },

module.exports = {
  purge: {
    enabled: true,
    content: [
      './src/**/*.html',
      './src/**/*.ts',
      './projects/**/*.html',
      './projects/**/*.ts'
    ]
  },

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { Component1 } from './component1/component1.component';
import { Component2 } from './component2/component2.component';

const routes: Routes = [
  { path: '', component: Component1 },
  { path: 'component2', component: Component2 },
  { path: '**', redirectTo: '/', pathMatch: 'full' },
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

const routes: Routes = [
  { path: '', component: Component1 },
  { path: 'component2', component: Component2 },
  { path: '**', redirectTo: '/', pathMatch: 'full' },
];

import { Subject } from 'rxjs';
import { debounceTime, tap } from 'rxjs/operators';

is_editing_xxx$ = new Subject<string>();

is_editing_xxx = this.is_editing_xxx$
    .pipe(
        tap(() => { this.loading_userconfig = true; }),
        debounceTime(1000),
        tap(() => {
            this.loading_userconfig = false;
        }))
    .subscribe();

ngOnInit(){     
}

click_sth(){
    this.is_editing_xxx$.next();
}