En este artículo vamos a ver qué es isPlatformBrowser en Angular 10 y cómo usarlo.
El navegador isPlatform
Sintaxis:
isPlatformBrowser(platformId);
NgModule: el módulo utilizado por isPlatformBrowser es:
- CommonModule
Valor devuelto: devuelve un valor booleano que indica si un
Acercarse:
- Cree la aplicación angular que se utilizará
- Importe isPlatformBrowser desde @angular/core al proyecto.
- En app.component.ts, defina el objeto que contiene el valor booleano.
- sirva la aplicación angular usando ng serve para ver el resultado
Ejemplo 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) } }
Producción:
Ejemplo 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>
Producción:
Referencia: https://angular.io/api/common/isPlatformBrowser