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。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。