Angular 2 & 4 - ng-pick-datetime 覆盖组件样式表答案

【问题标题】：Angular 2 & 4 - ng-pick-datetime overwriting component stylesheetAngular 2 & 4 - ng-pick-datetime 覆盖组件样式表
【发布时间】：2018-03-04 17:36:06
【问题描述】：

我正在使用 Angular CLI (ng4)，并且正在实施 ng-pick-datetime (https://www.npmjs.com/package/ng-pick-datetime)。

一切都按预期加载，这是一个相当不错的模块。

但是，我的关联组件样式表似乎在模块加载它自己的样式表之前就被加载了。因此覆盖我在组件样式表中声明的任何样式。

component.css

.owl-dateTime-dialog {
    background-color: #fff !important;
    border: 1px solid #000 !important;
}

See example here...

不太确定从这里去哪里。当然我已经错误地实现了模块，至于为什么它的样式表在组件之后加载？？？

.angular-cli.json

"styles": [
    "../node_modules/bootstrap/dist/css/bootstrap.min.css",
    "../node_modules/ng-pick-datetime/assets/style/picker.min.css",
    "styles.css"
  ],

选择日期和时间.component.ts

import { Router } from '@angular/router';
import { DateTimePickerModule } from 'ng-pick-datetime';
import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-select-date-and-time',
  templateUrl: './select-date-and-time.component.html',
  styleUrls: ['./select-date-and-time.component.css']
})
export class SelectDateAndTimeComponent implements OnInit {

  constructor() { }

  ngOnInit() { }

}

任何帮助将不胜感激！

【问题讨论】：

标签： css angular angular-cli

【解决方案1】：

将您的 css 类放在全局 styles.css

【讨论】：

谢谢@MiR。不确定是否有人会回复这个问题，但我确实是这样解决的。