Angular10 isPlatformBrowser() Function
Last Updated :
06 Jan, 2023
In this article, we are going to see what is isPlatformBrowser in Angular 10 and how to use it.
The isPlatformBrowser is used to get a platform id that represents a browser platform
Syntax:
isPlatformBrowser(platformId);
NgModule: Module used by isPlatformBrowser is:
Return Value: returns a Boolean Value stating whether a platform id represents a browser platform.
Approach:
- Create the angular app to be used
- Import isPlatformBrowser from @angular/core to the project.
- In app.component.ts define the object which holds the Boolean value.
- serve the angular app using ng serve to see the output
Example 1:
app.component.ts
import { Component, Inject }
from '@angular/core' ;
import { PLATFORM_ID }
from '@angular/core' ;
import { isPlatformBrowser }
from '@angular/common' ;
@Component({
selector: 'app-root' ,
templateUrl: './app.component.html' ,
styleUrls: [ './app.component.css' ]
})
export class AppComponent {
isBrowser: boolean;
constructor( @Inject(PLATFORM_ID) platformId: Object) {
this .isBrowser = isPlatformBrowser(platformId);
console.log( this .isBrowser)
}
}
|
Output:
Example 2:
app.component.ts
import { Component, Inject }
from '@angular/core' ;
import { PLATFORM_ID }
from '@angular/core' ;
import { isPlatformBrowser }
from '@angular/common' ;
@Component({
selector: 'app-root' ,
templateUrl: './app.component.html' ,
styleUrls: [ './app.component.css' ]
})
export class AppComponent {
isB: boolean;
constructor( @Inject(PLATFORM_ID) platformId: Object) {
this .isB = isPlatformBrowser(platformId);
}
}
|
app.component.html
< div * ngIf = 'isB' >< strong >GeeksforGeeks.</ strong ></ div >
< div * ngIf = 'isB' >isBrowserPlatform | angularJs.</ div >
|
Output:
Reference: https://angular.io/api/common/isPlatformBrowser
Like Article
Suggest improvement
Share your thoughts in the comments
Please Login to comment...