html - 如何从 div 中排除一个 css 类？

Question

我有一个场景，我必须在 login 页面使用 CSS 包含背景图片。但是，我不想在我的 home 页面上使用它。 HTML代码如下。

<div data-ng-controller="loginCtrl" class="bg">
    <div data-ng-if="!landingPage" data-ng-include="'view/login.html'"></div>
    <div data-ng-if="landingPage=='login'" data-ng-include="'view/login.html'"></div>
    <div data-ng-if="landingPage=='home'" data-ng-include="'view/home.html'"></div> <!--I don't want to use CSS class 'bg'-->
</div>

.css 文件是

body, html {
    height: 100%;
    margin: 0;
}

.bg {
    /* The image used */
    background-image: url('/custom/img/pp.jpg');

    /* Full height */
    height: 100%; 

    /* Center and scale the image nicely */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

我怎样才能实现它？

Answer 1

使用 ng-class

<div data-ng-controller="loginCtrl" ng-class="{bg: isLoggedIn}">
    <div data-ng-if="!landingPage" data-ng-include="'view/login.html'"></div>
    <div data-ng-if="landingPage=='login'" data-ng-include="'view/login.html'"></div>
    <div data-ng-if="landingPage=='home'" data-ng-include="'view/home.html'"></div> <!--I don't want to use CSS class 'bg'-->
</div>

登录后更新 $scope 变量为 true