I have question how to migrate to standalone if I want that:
- In ApplicationConfigService I want use httpclient How I can do it?
- After Init app I want use load function
export function initializeFn(jsonAppConfiguration: ApplicationConfigService){
return () =>{
return jsonAppConfiguration.load();
};
}
Please check following codes
export abstract class AppConfiguration{
baseUrl:string = '';
connectionName:string = '';
}
import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { AppConfiguration } from './app-config'
import { DOCUMENT } from '@angular/common';
import { Inject } from '@angular/core';
@Injectable({providedIn: 'root'})
export class ApplicationConfigService extends AppConfiguration{
constructor(@Inject(DOCUMENT) private document: Document, private http: HttpClient) {
super();
}
load(){
try{
this.connectionName = (this.document.getElementsByName("connectionName")[0] as any).value;
this.baseUrl = (this.document.getElementsByName("baseUrl")[0] as any).value;
}
catch{}
}
}
import { APP_INITIALIZER, Component } from '@angular/core';
import { RouterOutlet } from '@angular/router';
import { ApplicationConfigService } from './config/application-config.service';
import { HttpClientModule } from '@angular/common/http';
export function initializeFn(jsonAppConfiguration: ApplicationConfigService){
return () =>{
return jsonAppConfiguration.load();
};
}
@Component({
selector: 'app-root',
standalone: true,
imports: [
RouterOutlet,
HttpClientModule
],
providers: [
ApplicationConfigService,
{
provide:APP_INITIALIZER,
multi:true,
deps:[ApplicationConfigService],
useFactory:initializeFn
}
],
templateUrl: './app.component.html',
styleUrl: './app.component.scss'
})
export class AppComponent {
title = 'f_project';
}
import { HttpClient, HttpClientModule } from '@angular/common/http';
import { ChangeDetectorRef, Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { ApplicationConfigService } from '../config/application-config.service';
@Component({
selector: 'app-main',
standalone: true,
imports: [],
templateUrl: './main.component.html',
styleUrl: './main.component.scss'
})
export class MainComponent implements OnInit{
public ConnectionName: string = '';
constructor(private route: ActivatedRoute, private http: HttpClient, private AppConfig: ApplicationConfigService, private cdr: ChangeDetectorRef) {
this.ConnectionName = AppConfig.connectionName;
}
ngOnInit(): void {
console.log("ConnectionName: " + this.ConnectionName);
}
}
