Angular10 isPlatformBrowser()用法及代码示例

在本文中，我们将了解 Angular 10 中的 isPlatformBrowser 是什么以及如何使用它。

isPlatformBrowser用于获取代表浏览器平台的平台ID

用法:

isPlatformBrowser(platformId);

NgModule:isPlatformBrowser 使用的模块是：

CommonModule

返回值：返回一个布尔值，说明是否platform id 代表浏览器平台。

方法：

创建要使用的 angular 应用程序
将 isPlatformBrowser 从 @angular/core 导入到项目中。
在 app.component.ts 中定义保存布尔值的对象。
使用 ng serve 为 angular 应用程序提供服务以查看输出

范例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)
  }
}

输出：

范例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);
        
    }
}

应用程序组件.html


<div *ngIf='isB'><strong>GeeksforGeeks.</strong></div>
  
<div *ngIf='isB'>isBrowserPlatform | angularJs.</div>

输出：

参考：https://angular.io/api/common/isPlatformBrowser

相关用法

注：本文由纯净天空筛选整理自taran910大神的英文原创作品 Angular10 isPlatformBrowser() Function。非经特殊声明，原始代码版权归原作者所有，本译文未经允许或授权，请勿转载或复制。