Question

我终于能够使用angular-cli处理primeNG。在`.angular-cli.json我有：

  "styles": [
          "../node_modules/primeng/resources/themes/omega/theme.css",
          "../node_modules/primeng/resources/primeng.css",
        "styles.css"
      ],

我正在尝试使用CalendarModule，如此：

import {CalendarModule} from "primeng/primeng";

@NgModule({
    imports: [
        CalendarModule
    ],

在HTML中我有以下内容：

<p-calendar styleClass="test" [(ngModel)]="validationDate" 
inputStyleClass="test" [showIcon]="true" dateFormat="dd.mm.yy"></pcalendar>

在组件css中

@Component({
    selector: 'user-validation',
    templateUrl: 'user-validation.component.html',
    styleUrls: ['user-validation.component.css']
})

user-validation.component.css

.test{
    width: 25px;
}

Answer 1

试

/deep/ .test{
        width: 25px !important;
}

或

>>> .test{
width: 25px !important;
}

Answer 2

这对我有用 -

 <p-calendar name = "calendarMod" [showIcon]="true" [(ngModel)]="actionDate"  dateFormat="mm/dd/yy" [inputStyle] = "{'width':'85px'}" ></p-calendar>

无法使用style，styleClass，inputStyle或inputStyleClass Angular-CLI覆盖primeNG中的样式

2 个答案: