diff --git a/packages/angular/src/lib/cdk/platform-filters/android-filter.component.ts b/packages/angular/src/lib/cdk/platform-filters/android-filter.component.ts
new file mode 100644
index 0000000..c643378
--- /dev/null
+++ b/packages/angular/src/lib/cdk/platform-filters/android-filter.component.ts
@@ -0,0 +1,16 @@
+/* eslint-disable @angular-eslint/component-selector */
+import { Component, Inject } from '@angular/core';
+import { platformNames, IDevice } from '@nativescript/core';
+import { DEVICE } from '../../tokens';
+
+@Component({
+  selector: 'android',
+  template: `<ng-content *ngIf="show"></ng-content>`,
+})
+export class AndroidFilterComponent {
+  public show: boolean;
+
+  constructor(@Inject(DEVICE) device: IDevice) {
+    this.show = device.os === platformNames.android;
+  }
+}
diff --git a/packages/angular/src/lib/cdk/platform-filters/index.ts b/packages/angular/src/lib/cdk/platform-filters/index.ts
deleted file mode 100644
index 362e5cc..0000000
--- a/packages/angular/src/lib/cdk/platform-filters/index.ts
+++ /dev/null
@@ -1,28 +0,0 @@
-/* eslint-disable @angular-eslint/component-selector */
-import { Component, Inject } from '@angular/core';
-import { Device, platformNames } from '@nativescript/core';
-import { DEVICE } from '../../tokens';
-
-@Component({
-  selector: 'android',
-  template: `<ng-content *ngIf="show"></ng-content>`,
-})
-export class AndroidFilterComponent {
-  public show: boolean;
-
-  constructor(@Inject(DEVICE) device: typeof Device) {
-    this.show = device.os === platformNames.android;
-  }
-}
-
-@Component({
-  selector: 'ios',
-  template: `<ng-content *ngIf="show"></ng-content>`,
-})
-export class IosFilterComponent {
-  public show: boolean;
-  constructor(@Inject(DEVICE) device: typeof Device) {
-    console.log(device.os, platformNames.ios);
-    this.show = device.os === platformNames.ios;
-  }
-}
diff --git a/packages/angular/src/lib/cdk/platform-filters/ios-filter.component.ts b/packages/angular/src/lib/cdk/platform-filters/ios-filter.component.ts
new file mode 100644
index 0000000..6e820d1
--- /dev/null
+++ b/packages/angular/src/lib/cdk/platform-filters/ios-filter.component.ts
@@ -0,0 +1,15 @@
+/* eslint-disable @angular-eslint/component-selector */
+import { Component, Inject } from '@angular/core';
+import { platformNames, IDevice } from '@nativescript/core';
+import { DEVICE } from '../../tokens';
+
+@Component({
+  selector: 'ios',
+  template: `<ng-content *ngIf="show"></ng-content>`,
+})
+export class IOSFilterComponent {
+  public show: boolean;
+  constructor(@Inject(DEVICE) device: IDevice) {
+    this.show = device.os === platformNames.ios;
+  }
+}
diff --git a/packages/angular/src/lib/nativescript-common.module.ts b/packages/angular/src/lib/nativescript-common.module.ts
index 9a9352f..3bc6315 100644
--- a/packages/angular/src/lib/nativescript-common.module.ts
+++ b/packages/angular/src/lib/nativescript-common.module.ts
@@ -6,9 +6,10 @@ import { ListViewComponent, TemplateKeyDirective } from './cdk/list-view/list-vi
 import { registerNativeScriptViewComponents } from './element-registry';
 import { ModalDialogService } from './legacy/directives/dialogs';
 import { TabViewDirective, TabViewItemDirective } from './cdk/tab-view';
-import { AndroidFilterComponent, IosFilterComponent } from './cdk/platform-filters';
+import { AndroidFilterComponent } from './cdk/platform-filters/android-filter.component';
+import { IOSFilterComponent } from './cdk/platform-filters/ios-filter.component';
 
-const CDK_COMPONENTS = [ActionBarComponent, ActionBarScope, ActionItemDirective, NavigationButtonDirective, ListViewComponent, TemplateKeyDirective, TabViewDirective, TabViewItemDirective, AndroidFilterComponent, IosFilterComponent];
+const CDK_COMPONENTS = [ActionBarComponent, ActionBarScope, ActionItemDirective, NavigationButtonDirective, ListViewComponent, TemplateKeyDirective, TabViewDirective, TabViewItemDirective, AndroidFilterComponent, IOSFilterComponent];
 
 registerNativeScriptViewComponents();
 
diff --git a/packages/angular/src/lib/public_api.ts b/packages/angular/src/lib/public_api.ts
index 0130aea..bb44c9d 100644
--- a/packages/angular/src/lib/public_api.ts
+++ b/packages/angular/src/lib/public_api.ts
@@ -14,7 +14,8 @@ export * from './cdk/list-view';
 export * from './cdk/portal';
 export * from './cdk/dialog';
 export * from './cdk/tab-view';
-export * from './cdk/platform-filters';
+export * from './cdk/platform-filters/android-filter.component';
+export * from './cdk/platform-filters/ios-filter.component';
 export * from './file-system';
 export * from './nativescript-common.module';
 export * from './loading.service';
diff --git a/packages/angular/src/lib/tokens.ts b/packages/angular/src/lib/tokens.ts
index 4dc4b5b..03e4250 100644
--- a/packages/angular/src/lib/tokens.ts
+++ b/packages/angular/src/lib/tokens.ts
@@ -1,6 +1,5 @@
 import { InjectionToken } from '@angular/core';
-import { Page, View } from '@nativescript/core';
-import { Device } from '@nativescript/core';
+import { IDevice, Page, View } from '@nativescript/core';
 
 export const APP_ROOT_VIEW = new InjectionToken<View>('NativeScriptAppRootView');
 export const NATIVESCRIPT_ROOT_MODULE_ID = new InjectionToken<string | number>('NativeScriptRootModuleId');
@@ -18,7 +17,7 @@ export interface PageFactoryOptions {
 }
 
 export const DISABLE_ROOT_VIEW_HANDLING = new InjectionToken<boolean>('NativeScriptDisableRootViewHandling');
-export const DEVICE = new InjectionToken<typeof Device>('NativeScriptDevice');
+export const DEVICE = new InjectionToken<IDevice>('NativeScriptDevice');
 export const PAGE_FACTORY = new InjectionToken<PageFactory>('NativeScriptPageFactory');
 export const defaultPageFactory: PageFactory = function (_opts: PageFactoryOptions) {
   return new Page();