diff --git a/BREAKING.md b/BREAKING.md
index 22482f89240..3896ee79da4 100644
--- a/BREAKING.md
+++ b/BREAKING.md
@@ -22,6 +22,7 @@ This is a comprehensive list of the breaking changes introduced in the major ver
   - [Datetime](#version-8x-datetime)
   - [Nav](#version-8x-nav)
   - [Picker](#version-8x-picker)
+- [Angular](#version-8x-angular)
 
 <h2 id="version-8x-browser-platform-support">Browser and Platform Support</h2>
 
@@ -143,3 +144,80 @@ This allows components to inherit the color properly when used outside of Ionic
 - `ion-picker` and `ion-picker-column` have been renamed to `ion-picker-legacy` and `ion-picker-legacy-column`, respectively. This change was made to accommodate the new inline picker component while allowing developers to continue to use the legacy picker during this migration period.
   - Only the component names have been changed. Usages such as `ion-picker` or `IonPicker` should be changed to `ion-picker-legacy` and `IonPickerLegacy`, respectively.
   - Non-component usages such as `pickerController` or `useIonPicker` remain unchanged. The new picker displays inline with your page content and does not have equivalents for these non-component usages.
+
+<h4 id="version-8x-angular">Angular</h4>
+
+- NavParams has been removed in favor of using Angular's Input API. Components that accessed parameters should ensure that an input is created for each parameter:
+
+**Old**
+```js
+import { NavParams } from '@ionic/angular';
+
+console.log(this.navParams.get('myProp'));
+```
+
+**New**
+```js
+import { Input } from '@angular/core';
+
+...
+
+@Input() myProp: string;
+
+ngOnInit() {
+  console.log(this.myProp)
+}
+```
+
+Developers who were using `NavParams` as a pass through to an encapsulated IonNav component can use a single `Input` to achieve the same behavior.
+
+**Old**
+```js
+// home.page.ts
+const modal = await modalCtrl.create({
+  component: NavComponent,
+  componentProps: {
+    foo: 'hello',
+    bar: 'goodbye'
+  }
+});
+```
+
+```js
+// nav.component.ts
+public rootParams = {};
+
+constructor(private navParams: NavParams) {
+  this.rootParams = {
+    ...navParams.data
+  }
+}
+```
+```html
+<!-- nav.component.html -->
+<ion-nav [rootParams]="rootParams"></ion-nav>
+```
+
+**New**
+
+```js
+// home.page.ts
+const modal = await modalCtrl.create({
+  component: NavComponent,
+  componentProps: {
+    rootParams: {
+      foo: 'hello',
+      bar: 'goodbye'
+    }
+  }
+});
+```
+
+```js
+// nav.component.ts
+@Input() rootParams = {};
+```
+```html
+<!-- nav.component.html -->
+<ion-nav [rootParams]="rootParams"></ion-nav>
+```
\ No newline at end of file
diff --git a/packages/angular/common/src/directives/navigation/nav-params.ts b/packages/angular/common/src/directives/navigation/nav-params.ts
deleted file mode 100644
index a5af4b9d631..00000000000
--- a/packages/angular/common/src/directives/navigation/nav-params.ts
+++ /dev/null
@@ -1,43 +0,0 @@
-/**
- * @description
- * NavParams are an object that exists on a page and can contain data for that particular view.
- * Similar to how data was pass to a view in V1 with `$stateParams`, NavParams offer a much more flexible
- * option with a simple `get` method.
- *
- * @usage
- * ```ts
- * import { NavParams } from '@ionic/angular';
- *
- * export class MyClass{
- *
- *  constructor(navParams: NavParams){
- *    // userParams is an object we have in our nav-parameters
- *    navParams.get('userParams');
- *  }
- *
- * }
- * ```
- */
-export class NavParams {
-  constructor(public data: { [key: string]: any } = {}) {}
-
-  /**
-   * Get the value of a nav-parameter for the current view
-   *
-   * ```ts
-   * import { NavParams } from 'ionic-angular';
-   *
-   * export class MyClass{
-   *  constructor(public navParams: NavParams){
-   *    // userParams is an object we have in our nav-parameters
-   *    this.navParams.get('userParams');
-   *  }
-   * }
-   * ```
-   *
-   * @param param Which param you want to look up
-   */
-  get<T = any>(param: string): T {
-    return this.data[param];
-  }
-}
diff --git a/packages/angular/common/src/index.ts b/packages/angular/common/src/index.ts
index 6e5c909acf3..7c8a8bceb79 100644
--- a/packages/angular/common/src/index.ts
+++ b/packages/angular/common/src/index.ts
@@ -10,8 +10,6 @@ export { bindLifecycleEvents, AngularDelegate } from './providers/angular-delega
 export type { IonicWindow } from './types/interfaces';
 export type { ViewWillEnter, ViewWillLeave, ViewDidEnter, ViewDidLeave } from './types/ionic-lifecycle-hooks';
 
-export { NavParams } from './directives/navigation/nav-params';
-
 export { IonPopover } from './overlays/popover';
 export { IonModal } from './overlays/modal';
 
diff --git a/packages/angular/common/src/providers/angular-delegate.ts b/packages/angular/common/src/providers/angular-delegate.ts
index c9efeb83319..0e51a197b81 100644
--- a/packages/angular/common/src/providers/angular-delegate.ts
+++ b/packages/angular/common/src/providers/angular-delegate.ts
@@ -6,7 +6,6 @@ import {
   EnvironmentInjector,
   inject,
   createComponent,
-  InjectionToken,
   ComponentRef,
 } from '@angular/core';
 import {
@@ -18,8 +17,6 @@ import {
   LIFECYCLE_WILL_UNLOAD,
 } from '@ionic/core/components';
 
-import { NavParams } from '../directives/navigation/nav-params';
-
 // TODO(FW-2827): types
 
 @Injectable()
@@ -123,26 +120,9 @@ export const attachView = (
   cssClasses: string[] | undefined,
   elementReferenceKey: string | undefined
 ): any => {
-  /**
-   * Wraps the injector with a custom injector that
-   * provides NavParams to the component.
-   *
-   * NavParams is a legacy feature from Ionic v3 that allows
-   * Angular developers to provide data to a component
-   * and access it by providing NavParams as a dependency
-   * in the constructor.
-   *
-   * The modern approach is to access the data directly
-   * from the component's class instance.
-   */
-  const childInjector = Injector.create({
-    providers: getProviders(params),
-    parent: injector,
-  });
-
   const componentRef = createComponent<any>(component, {
     environmentInjector,
-    elementInjector: childInjector,
+    elementInjector: injector,
   });
 
   const instance = componentRef.instance;
@@ -230,23 +210,3 @@ export const bindLifecycleEvents = (zone: NgZone, instance: any, element: HTMLEl
     return () => unregisters.forEach((fn) => fn());
   });
 };
-
-const NavParamsToken = new InjectionToken<any>('NavParamsToken');
-
-const getProviders = (params: { [key: string]: any }) => {
-  return [
-    {
-      provide: NavParamsToken,
-      useValue: params,
-    },
-    {
-      provide: NavParams,
-      useFactory: provideNavParamsInjectable,
-      deps: [NavParamsToken],
-    },
-  ];
-};
-
-const provideNavParamsInjectable = (params: { [key: string]: any }) => {
-  return new NavParams(params);
-};
diff --git a/packages/angular/src/index.ts b/packages/angular/src/index.ts
index da4a6c549c0..8096030ef63 100644
--- a/packages/angular/src/index.ts
+++ b/packages/angular/src/index.ts
@@ -24,7 +24,6 @@ export {
   Config,
   Platform,
   AngularDelegate,
-  NavParams,
   IonicRouteStrategy,
   ViewWillEnter,
   ViewWillLeave,
diff --git a/packages/angular/standalone/src/index.ts b/packages/angular/standalone/src/index.ts
index 741fef2831f..a47da34dc10 100644
--- a/packages/angular/standalone/src/index.ts
+++ b/packages/angular/standalone/src/index.ts
@@ -20,7 +20,6 @@ export {
   NavController,
   Config,
   Platform,
-  NavParams,
   IonicRouteStrategy,
   ViewWillEnter,
   ViewDidEnter,