primeng未渲染primeNG的css，被覆盖的角度为4.0.1

Question

我可以让JSON呈现，但不能让样式呈现。我将css链接添加到index.html文件：

 <!-- #CSS Links -->
    <link rel="stylesheet" type="text/css" href="../node_modules/primeng/resources/themes/bootstrap/theme.css">
    <link rel="stylesheet" type="text/css" href="../node_modules/primeng/resources/primeng.css">
    <link rel="stylesheet" type="text/css" href="../node_modules/primeng/resources/primeng.min.css">
    <link rel="stylesheet" type="text/css" href="../node_modules/primeng/resources/themes/_theme.scss">
    <link rel="stylesheet" type="text/css" href="../node_modules/primeng/resources/themes/cruze/theme.css">
    <link rel="stylesheet" type="text/css" href="../node_modules/primeng/resources/themes/cupertino/theme.css">
    <link rel="stylesheet" type="text/css" href="../node_modules/primeng/resources/themes/cupertino/theme.css.map">
    <link rel="stylesheet" type="text/css" href="../node_modules/primeng/resources/themes/darkness/theme.css">
    <link rel="stylesheet" type="text/css" href="../node_modules/primeng/resources/themes/flick/theme.css">
    <link rel="stylesheet" type="text/css" href="../node_modules/primeng/resources/themes/home/theme.css">
    <link rel="stylesheet" type="text/css" href="../node_modules/primeng/resources/themes/kasper/theme.css">
    <link rel="stylesheet" type="text/css" href="../node_modules/primeng/resources/themes/lightness/theme.css">
    <link rel="stylesheet" type="text/css" href="../node_modules/primeng/resources/themes/ludvig/theme.css">
    <link rel="stylesheet" type="text/css" href="../node_modules/primeng/resources/themes/omega/theme.css">
    <link rel="stylesheet" type="text/css" href="../node_modules/primeng/resources/themes/pepper-grinder/theme.css">
    <link rel="stylesheet" type="text/css" href="../node_modules/primeng/resources/themes/redmond/theme.css">
    <link rel="stylesheet" type="text/css" href="../node_modules/primeng/resources/themes/rocket/theme.css">
    <link rel="stylesheet" type="text/css" href="../node_modules/primeng/resources/themes/south-street/theme.css">
    <link rel="stylesheet" type="text/css" href="../node_modules/primeng/resources/themes/start/theme.css">
    <link rel="stylesheet" type="text/css" href="../node_modules/primeng/resources/themes/trontastic/theme.css">
    <link rel="stylesheet" type="text/css" href="../node_modules/primeng/resources/themes/voclain/theme.css">

但是，我的控制台为每个链接提供了一个404，但路径是正确的。

在我的html文件中，我有：

<div class="col-md-9 col-md-push-3 bordered tableScroll boxSize">
    <div class="centerTree">
        <p-tree [value]="files" layout="horizontal"></p-tree>
    </div>
</div>

组件：

    @Component({
    selector: 'office',
    templateUrl: './office.html',
    styleUrls: ['office.css'],
    encapsulation: ViewEncapsulation.None

})
export class OfficeComponent implements OnInit {

 files: TreeNode[];


 ngOnInit() {
        this.nodeService.getFiles().then(files => {
            this.files = [{
                label: 'Root',
                children: files
            }];
        });
    }

当我查看控制台查看正在呈现的css时，它是模板的CSS，而不是primefaces。我试图覆盖它，但没有成功。

Answer 1

导入组件ts文件中的css

import 'primeng/resources/primeng.min.css'