Html 如何用角5显示每页不同的背景色？

我不熟悉Angular，我需要更改body标签的

背景色。我在Angular中创建了一个包含多个页面的项目

Ex:

Login / Home / About / Service / Contact

我需要在每页上显示不同的
背景色

但实际上，在这里，body标记对于所有页面都是通用的，因此我无法更改“CSS中的背景色”
您可以尝试在组件
ngOnInit
生命周期中更改它，
像这样的

ngOnInit(){
    document.body.style.backgroundColor = 'red';
} 

@Component({
    selector: "app-theme",
    templateUrl: "./theme.component.html",
    encapsulation: ViewEncapsulation.None,
    styleUrls: ['./theme.component.scss']
})

在组件代码中

或者您也可以尝试更改
视图封装
，但它会更改所有组件样式的视图封装，因此它可能会让您遇到意外情况

像这样的

ngOnInit(){
    document.body.style.backgroundColor = 'red';
} 

@Component({
    selector: "app-theme",
    templateUrl: "./theme.component.html",
    encapsulation: ViewEncapsulation.None,
    styleUrls: ['./theme.component.scss']
})

正如你在评论中所问的，你也想编辑body类，所以我想你会选择我写的第一个选项

根据要处理的类的数量，它可能会有所不同。我只写一节课的例子

ngOnInit(){
  const body = document.body;
  body.className = '';
  body.classList.add('classname');
}

如果需要处理更多的类，则需要编辑代码，只删除不需要的类，而不是全部使用
！重要信息
和页面中的覆盖，它应该可以工作。或者将所有页面命名为
谢谢你的快速回答，我想在主体标签中添加类，用于更改每个组件，如：登录页html标签主页html标签@jayaprakash我将在几分钟内编辑答案是的，我尝试了你更新的答案工作正常，但类未删除更改我分配的另一个组件类[Login\u bg]对于登录组件，它在我登录后工作正常，它正在移动到下一个组件主页，但仍然[login_bg]进入body标签。不需要在home组件中登录\u bg我有多个组件每个组件都可以删除以前的类登录\u bg？@jayaprakash我现在已经测试了我的示例，它可以正常工作。您确定加载的组件顺序正确吗？