https://github.com/Celtian/ngx-if-platform
Directive for conditional display based on platform
https://github.com/Celtian/ngx-if-platform
angular library
Last synced: about 1 month ago
JSON representation
Directive for conditional display based on platform
- Host: GitHub
- URL: https://github.com/Celtian/ngx-if-platform
- Owner: Celtian
- License: mit
- Created: 2021-10-02T11:04:45.000Z (over 3 years ago)
- Default Branch: master
- Last Pushed: 2025-04-14T08:36:27.000Z (2 months ago)
- Last Synced: 2025-05-04T06:35:33.783Z (about 2 months ago)
- Topics: angular, library
- Language: TypeScript
- Homepage: https://celtian.github.io/ngx-if-platform
- Size: 1.75 MB
- Stars: 5
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
- Security: SECURITY.md
Awesome Lists containing this project
- fucking-awesome-angular - ngx-if-platform - Directive for conditional display based on platform. (Table of contents / Third Party Components)
- awesome-angular - ngx-if-platform - Directive for conditional display based on platform. (Table of contents / Third Party Components)
README
NgxIfPlatform
[](https://badge.fury.io/js/ngx-if-platform)
[](https://www.npmjs.com/ngx-if-platform)
[](https://www.npmjs.com/ngx-if-platform)
[](https://snyk.io/advisor/npm-package/ngx-if-platform)
[](https://codecov.io/gh/celtian/ngx-if-platform/)
[](https://github.com/celtian/ngx-if-platform/)
[](https://github.com/celtian/ngx-if-platform/)
[](http://hits.dwyl.com/celtian/ngx-if-platform)
> Angular directive for conditional display based on platform
> ✓ _Angular 19 compatible_
Here's the [demo](http://celtian.github.io/ngx-if-platform/) or [stackblitz live preview](https://stackblitz.com/edit/ngx-if-platform) or [codesandbox live preview](https://codesandbox.io/s/ngx-if-platform-dgtck)
- Lightweight
- No dependencies!
- Directive way
## 🛠️ Install
1. Use yarn (or npm) to install the package
```terminal
yarn add ngx-if-platform
```
2. Add `NgxIfPlatformModule` (or specific directive) into your `imports`
```typescript
import { NgxIfPlatformModule } from 'ngx-if-platform';
@Component({
standalone: true,
imports: [NgxIfPlatformModule /* , ... */],
// ...
})
```
or
```typescript
import { NgxIfPlatformModule } from 'ngx-if-platform';
@NgModule({
// ...
imports: [
// ...
NgxIfPlatformModule
]
})
```
## 🚀 Quick start
### Example code
```html
Is browser
Is server (disabled)
Is server
Not server
```
### Result
```code
Is browser
Is server (disabled)
Not server
```
## 🛠️ Options
There are these directives: ngxIfBrowser, ngxIfServer, ngxIfWorkerApp, ngxIfWorkerUi
### Directive & attributes
| Option | Type | Default | Description |
| --------------------- | ----------- | ------- | ------------------------------------------ |
| **[ngxIfBrowser]** | boolean | true | Directive can be disabled |
| **[ngxIfNotBrowser]** | templateRef | none | TemplateRef used if confition do not match |
| **[ngxIfServer]** | boolean | true | Directive can be disabled |
| **[ngxIfNotServer]** | templateRef | none | TemplateRef used if confition do not match |
## 🔧 Compatibility
| Angular | ngx-if-platform | Install |
| --------- | --------------- | ---------------------------- |
| >= 18 | 3.x | `yarn add ngx-if-platform` |
| >= 14 | 2.x | `yarn add ngx-if-platform@2` |
| >= 12 | 1.x | `yarn add ngx-if-platform@1` |
| >= 5 < 13 | 0.x | `yarn add ngx-if-platform@0` |
## 🪪 License
Copyright © 2021 - 2025 [Dominik Hladik](https://github.com/Celtian)
All contents are licensed under the [MIT license].
[mit license]: LICENSE