diff --git a/docs/en/framework/ui/angular/manage-profile-page-tabs.md b/docs/en/framework/ui/angular/manage-profile-page-tabs.md
index 232575a419..36ccf052ec 100644
--- a/docs/en/framework/ui/angular/manage-profile-page-tabs.md
+++ b/docs/en/framework/ui/angular/manage-profile-page-tabs.md
@@ -9,7 +9,7 @@ See the example below, covers all features:
 ```ts
 // manage-profile-tabs.provider.ts
 
-import { APP_INITIALIZER, Component } from "@angular/core";
+import { provideAppInitializer, Component } from "@angular/core";
 import { TwoFactorTabComponent } from "@volo/abp.ng.account/public";
 import {
   eAccountManageProfileTabNames,
@@ -25,41 +25,41 @@ import { MyAwesomeTabComponent } from "./my-awesome-tab/my-awesome-tab.component
 class MyAwesomeTabComponent {}
 
 export const MANAGE_PROFILE_TAB_PROVIDER = {
-  provide: APP_INITIALIZER,
-  useFactory: configureManageProfileTabs,
-  deps: [ManageProfileTabsService],
-  multi: true,
+  provideAppInitializer(()=>{
+    configureManageProfileTabs();
+  }),
 };
 
-export function configureManageProfileTabs(tabs: ManageProfileTabsService) {
-  return () => {
-    tabs.add([
-      {
-        name: "::MyAwesomeTab", // supports localization keys
-        order: 5,
-        component: MyAwesomeTabComponent,
-      },
-    ]);
-
-    tabs.patch(eAccountManageProfileTabNames.TwoFactor, {
-      name: "Two factor authentication",
-      component: TwoFactorTabComponent,
-    });
-
-    tabs.remove([eAccountManageProfileTabNames.ProfilePicture]);
-  };
+export function configureManageProfileTabs() {
+  tabs = inject(ManageProfileTabsService);
+  tabs.add([
+    {
+      name: "::MyAwesomeTab", // supports localization keys
+      order: 5,
+      component: MyAwesomeTabComponent,
+    },
+  ]);
+
+  tabs.patch(eAccountManageProfileTabNames.TwoFactor, {
+    name: "Two factor authentication",
+    component: TwoFactorTabComponent,
+  });
+
+  tabs.remove([eAccountManageProfileTabNames.ProfilePicture]);
 }
 ```
 
 ```ts
-//app.module.ts
+//app.config.ts
 
 import { MANAGE_PROFILE_TAB_PROVIDER } from "./manage-profile-tabs.provider";
 
-@NgModule({
-  providers: [MANAGE_PROFILE_TAB_PROVIDER],
-})
-export class AppModule {}
+export const appConfig: ApplicationConfig = {
+  providers: [
+    // ...
+    MANAGE_PROFILE_TAB_PROVIDER
+  ],
+};
 ```
 
 What we have done above;
@@ -70,7 +70,7 @@ What we have done above;
   - Renamed the "Two factor" tab label.
   - Removed the "Profile picture" tab.
 - Determined the `MANAGE_PROFILE_TAB_PROVIDER` to be able to run the `configureManageProfileTabs` function on initialization.
-- Registered the `MANAGE_PROFILE_TAB_PROVIDER` to the `AppModule` providers.
+- Registered the `MANAGE_PROFILE_TAB_PROVIDER` to the `appConfig` providers.
 
 See the result: