How often do you need to fix some bug or implement some feature for some specific browser or operating system like iOS / Android? I am quite sure that it happens very often. And also very often developers use different hacks for it or reinvent the wheel.
The truth is that the Angular team has done it already for you many years ago and included it in Angular CDK (Component Development Kit), so you should not write the logic from scratch but just re-use the logic.
If you are not using Angular CDK yet – you need just install it, so just navigate in your Terminal to the root folder of your project and run the next command:
ng add @angular/cdk
Once you have done it you need to import the Platform Module inside the module where you are going to implement browser-specific feature (app.module.ts as an example)
// ... some other imports
import {PlatformModule} from '@angular/cdk/platform';
@NgModule({
declarations: [
AppComponent
],
imports: [
// ... other modules
BrowserModule,
PlatformModule // <-- Import here
],
})
export class AppModule { }
And now you can inject the Platform service into any component where you need it and check the appropriate field. As an example like this:
import {Component} from '@angular/core';
@Component({
selector: 'some-component',
templateUrl: 'some-component.html'
})
export class SomeComponent {
constructor(public platform: Platform) {
if (this.platform.IOS) {
console.log('this is IOS device!');
}
}
}
And that’s it! It is very simple!
There is a list of all available platform values:
ANDROID | If the device OS is Android |
IOS | If the device OS is IOS |
FIREFOX | If it is a browser Firefox |
BLINK | If it is a browser Chrome |
WEBKIT | If it is WebKit-based browser (Opera) |
TRIDENT | If it is a browser IE 💩 |
EDGE | If it is a browser Microsoft EDGE ———–———————————————————- Note! Since version 79 EDGE uses the Blink browser engine, so this option works only for old EDGE versions. |
SAFARI | If it is a browser Safari |
Alright, guys, that’s it! As you can see it is very easy. If you prefer video format you can see my video dedicated to this topic.

Advanced Angular Forms – Deep Dive
Check out the most Advanced Angular Forms course made by Google Developer Expert in Angular
It is rather valuable piece
This design is wicked! You certainly know how to keep a reader amused. Fermin Gierke
This does not detect OS bruh, this detects Android/iOS and browsers, not MacOS, Linux, Windows, or anything else. Disapointing as expected.
As expected… 😀
I think you are confused. OOSS and browsers are not the same thing. And the article is not claiming to detect OS, but rather browser and it works like a charm. Maybe you should pick up some good ol’ textbooks before puking a comment like this 😉