在特定組件/路徑上添加視頻背景

Question

我想設置一個全屏視頻背景，我只想在應用「主頁」上顯示，但沒有成功。在應用上呈現的第一個組件是HomeComponent。

應用路由-module.ts（僅路徑顯示）

const routes: Routes = [ 
{ path: '', redirectTo: '/accueil', pathMatch: 'full'}, 
{ path: 'accueil', component: HomeComponent }, 
{ path: 'ligne/:lineId', component: LineComponent }, 
{ path: 'ligne/:lineId/station/:stationName', component: StationComponent } 
]; 

我希望做的是有聲視頻的背景，只有當我在/ ACCUEIL但不是在其他路徑/組件。有沒有辦法做到這一點？

在此先感謝。

Answer 1

您可以將路由器添加到您的組件包含要設置背景的視頻

，然後做這樣的事情在div：

if(this.router.url===routeIWant){ 
    this.custom-bg=true 
}else{ 
    this.custom-bg=false 
} 

而且對HTML以下的div在任何一個你想設置的BG

<div [ngClass]="{'customBgClass': custom-bg}"> 

而關於CSS

.customBgClass{ 
background: url(your-video-url) 
}