Css 角度4：样式URL无法正常工作

我刚刚在第四章中遇到了一个奇怪的行为。我有以下组成部分：

@Component({
    selector: 'user-wallets',
    templateUrl: './user-wallets.component.html',
    styleUrls: [
        './user-wallets.scss'
    ]
})
export class UserWalletsComponent implements OnInit, OnDestroy {

    <!-- component logic... -->
}

代码工作正常，选项卡呈现正确。控制台中没有错误

现在奇怪的是，.charts col的样式被正确应用，而.tab窗格的样式却没有

.tab窗格是从中生成的DOM对象

但是，当我在我的global.scs中为.tab窗格放置完全相同的样式时，这些样式就会被应用

---

现在我的问题是：为什么应用了.charts col的样式而不是.tab窗格的样式（它通常在global.scss中工作，但不在组件的特定样式中）？

我为jhipster添加了一个额外的标记，因为您似乎正在使用它，我认为它与您的问题的解决方案相关。在我的jhipster项目中加载仅组件的css时，我也遇到过类似的问题，我通常只会更改global.scss。一个合适的解决方案会非常有用。没错，我用的是jhipster。你补充了什么？它已经承诺了吗？我怎样才能解决这个问题：）我不知道怎么解决它。我也想知道答案。我在你的问题上添加了一个额外的标签，这样它就可以得到jhipster专家的更多关注，他们可能会提供帮助。啊，这就是你添加额外标签的意思。我以为你是jhipster的开发者。

<div class="user-wallets">
    <h2>
        <span jhiTranslate="coinlenderApp.userWallets.home.title">Wallets</span>
    </h2>
    <jhi-alert></jhi-alert>
    <ngb-tabset>
        <ngb-tab *ngFor="let userAccountArr of sourceSystemsUserAccounts">
            <ng-template ngbTabTitle>
               {{ userAccountArr[0].sourceSystem.name }}
            </ng-template>
            <ng-template ngbTabContent>
                <div class="row">
                    <div class="col-md-12 charts-col">
                        Charts here
                    </div>
                </div>
            </ng-template>
        </ngb-tab>
    </ngb-tabset>
</div>

.charts-col {
    background: black;
}

.tab-pane {
    float: left;
    min-width: 300px;
    background: black;
}