Priming beta 15 Angular 2数据表未使用样式进行渲染

我在让Priming DataTable在我的web应用程序上正确呈现时遇到问题。当前，显示如下所示

在my package.json dependencies部分中，如下所示

"dependencies": {
    "@angular/common": "2.0.0",
    "@angular/compiler": "2.0.0",
    "@angular/core": "2.0.0",
    "@angular/forms": "2.0.0",
    "@angular/http": "2.0.0",
    "@angular/platform-browser": "2.0.0",
    "@angular/platform-browser-dynamic": "2.0.0",
    "@angular/router": "3.0.0",
    "@angular/upgrade": "2.0.0",
    "@angular2-material/button": "^2.0.0-alpha.8-2",
    "@angular2-material/core": "^2.0.0-alpha.8-2",
    "@angular2-material/input": "^2.0.0-alpha.8-2",
    "@angular2-material/card": "^2.0.0-alpha.8-2",
    "@angular2-material/toolbar": "^2.0.0-alpha.8-2",
    "core-js": "^2.4.1",
    "hammerjs": "^2.0.8",
    "reflect-metadata": "^0.1.8",
    "rxjs": "5.0.0-beta.12",
    "systemjs": "^0.19.38",
    "zone.js": "^0.6.23",
    "primeng": "^1.0.0-beta.15"
  },

摘自我的systemjs.config.js文件

var map = {
        'app': 'app', // 'dist',
        '@angular': 'lib/@angular',
        'rxjs': 'lib/rxjs',
        '@angular2-material': 'lib/@angular2-material',
        'primeng': 'lib/primeng'
    };
    // packages tells the System loader how to load when no filename and/or no extension
    var packages = {
        'app': { main: 'main.js', defaultExtension: 'js' },
        'rxjs': { defaultExtension: 'js' },
        '@angular2-material/core': { main: 'core.umd.js', defaultExtension: 'js' },
        '@angular2-material/button': { main: 'button.umd.js', defaultExtension: 'js' },
        '@angular2-material/input': { main: 'input.umd.js', defaultExtension: 'js' },
        '@angular2-material/card': { main: 'card.umd.js', defaultExtension: 'js' },
        '@angular2-material/toolbar': { main: 'toolbar.umd.js', defaultExtension: 'js' },
        'primeng': { defaultExtension: 'js' }
    };

app.module.ts文件

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';

import { AppComponent } from './app.component';

import { LoginFormComponent } from './login-form.component';
import { OrganizationGroupComponent } from './organization-group/organization-group.component';
import { HomeComponent } from './home.component';
import { LoginService } from './login.service';
import { OrganizationGroupService } from './organization-group/organization-group.service';
import { AuthGuard } from './authguard';
import { routing } from './app.routing';
import { MdButtonModule } from '@angular2-material/button';
import { MdInputModule } from '@angular2-material/input';
import { MdCardModule } from '@angular2-material/card';
import { MdToolbarModule } from '@angular2-material/toolbar';
import { DataTableModule } from 'primeng/primeng';



@NgModule({
    imports: [
        BrowserModule,
        FormsModule,
        HttpModule,
        routing,
        MdButtonModule,
        MdInputModule,
        MdCardModule,
        MdToolbarModule,
        DataTableModule
    ],
    declarations: [
        AppComponent,
        LoginFormComponent,
        HomeComponent,
        OrganizationGroupComponent
    ],
    providers: [
        LoginService,
        AuthGuard,
        OrganizationGroupService
    ],
    bootstrap: [AppComponent]
})

export class AppModule { }

我的HTML文件

<div>
    <p-dataTable [value]="organizationGroups" [lazy]="true" [rows]="10" [paginator]="true"
                 [totalRecords]="totalRecords" (onLazyLoad)="loadOrganizationGroupsLazy($event)">
        <header>List of OrganizationGroups</header>
        <p-column field="Id" header="Id"></p-column>
        <p-column field="Name" header="Name"></p-column>
    </p-dataTable>
</div>

看起来我正在加载样式表（下面是控制台输出）

有没有想过为什么输出在没有应用样式的情况下看起来是无格式的

我尝试降级到Angular2 RC 6，但结果相同。不知道我错过了什么。我可以在Angular2发行版中使用最新版本的Priming吗？

安装以下CSS并将其添加到您的

index.html

：

<link rel="stylesheet" type="text/css" href="node_modules/primeui/themes/omega/theme.css" />
<link rel="stylesheet" type="text/css" href="node_modules/primeui/primeui-ng-all.min.css" />

安装以下CSS并将其添加到您的

index.html

：

<link rel="stylesheet" type="text/css" href="node_modules/primeui/themes/omega/theme.css" />
<link rel="stylesheet" type="text/css" href="node_modules/primeui/primeui-ng-all.min.css" />

---

我需要从外部（布局）页面加载css文件，一切都正常。由于某些原因，我无法使用组件的styleurl数组

<link rel="stylesheet" href="lib/primeng/resources/themes/omega/theme.css" />
<link rel="stylesheet" href="lib/primeng/resources/primeng.min.css" />
<link rel="stylesheet" href="app/font-awesome.min.css" />

---

我需要从外部（布局）页面加载css文件，一切都正常。由于某些原因，我无法使用组件的styleurl数组

<link rel="stylesheet" href="lib/primeng/resources/themes/omega/theme.css" />
<link rel="stylesheet" href="lib/primeng/resources/primeng.min.css" />
<link rel="stylesheet" href="app/font-awesome.min.css" />

鉴于他们显然正在加载这些样式表，您认为这有什么帮助？这些引用在没有

节点\u模块/

的生产环境中也不起作用。考虑到它们显然正在加载这些样式表，您认为这有什么帮助？这些引用在生产环境中也不起作用，因为生产环境中也没有

节点\u模块/

。