在特定组件/路径上添加视频背景

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