Hi, I just started working with angular 2. I found this PrimeNG library, I followed this guide: http://blog.davincisoftware.sk/primeng-web-component-framework-based-on-angularjs-2 It all works, except for styles. They do not apply in any way, and I really do not know what to do. this is what my table looks like: 
<div class="content-wrapper fullscreen-override"> <section class="content-header"> <H1>Users</H1> </section> <section class="content"> <div class="row col-lg-10 center"> <div class="box box-primary"> <p-dataTable [(value)]="users" selectionMode="single" [(selection)]="selectedUser" (onRowSelect)="onRowSelect($event)" rows="5" [paginator]="true" [pageLinks]="3" [rowsPerPageOptions]="[5,10,20]" [globalFilter]="gb" [responsive]="true"> <p-column field="email" header="email" [filter]="true" filterMatchMode="contains" [sortable]="true"></p-column> <p-column field="first_name" header="first_name" [filter]="true" filterMatchMode="contains" [sortable]="true"></p-column> <p-column field="last_name" header="last_name" [filter]="true" filterMatchMode="contains" [sortable]="true"></p-column> <p-column field="is_superuser" header="is_superuser" [filter]="true" filterMatchMode="contains" [sortable]="true"></p-column> <footer> <div class="ui-helper-clearfix" style="width:100%"> <button type="button" pButton icon="fa-plus" style="float:left" (click)="showDialogToAdd()" label="Add"></button> <button type="button" pButton icon="fa-pencil-square-o" style="float:left" (click)="showDialogToEdit()" [disabled]="selectedUser == null" label="Edit"></button> <button type="button" pButton icon="fa-close" style="float:left" (click)="delete()" [disabled]="selectedUser == null" label="Delete"></button> </div> </footer> </p-dataTable> <p-dialog header="User details" [(visible)]="displayDialog" [responsive]="true" showEffect="fade" [modal]="true"> <div class="ui-grid ui-grid-responsive ui-fluid" *ngIf="displayableUser"> <div class="ui-grid-row"> <div class="ui-grid-col-4"><label for="email">email</label></div> <div class="ui-grid-col-8"><input pInputText id="email" [(ngModel)]="displayableUser.email" /></div> </div> <div class="ui-grid-row"> <div class="ui-grid-col-4"><label for="name">first_name</label></div> <div class="ui-grid-col-8"><input pInputText id="first_name" [(ngModel)]="displayableUser.first_name" /></div> </div> <div class="ui-grid-row"> <div class="ui-grid-col-4"><label for="surname">last_name</label></div> <div class="ui-grid-col-8"><input pInputText id="last_name" [(ngModel)]="displayableUser.last_name" /></div> </div> <div class="ui-grid-row"> <div class="ui-grid-col-4"><label for="country">is_superuser</label></div> <div class="ui-grid-col-8"><input pInputText id="is_superuser" [(ngModel)]="displayableUser.is_superuser" /></div> </div> </div> <footer> <div class="ui-dialog-buttonpane ui-widget-content ui-helper-clearfix"> <button type="button" pButton icon="fa-check" (click)="save()" label="Save"></button> </div> </footer> </p-dialog> </div> </div> </section> </div>
Above is my pattern.
Also, I don’t quite understand how to apply my own classes to their elements.
This is my component class (I also tried removing the style attribute in the decorator component
import { Router } from '@angular/router'; import { Component, OnInit } from '@angular/core'; import { ROUTER_DIRECTIVES } from '@angular/router'; import { UsersFormCreation } from './modal_forms/creation/users.forms.creation'; import {DataTable, Column, TabPanel, TabView, Header, Footer, Dialog, Button, InputText} from 'primeng/primeng'; import { RequestService } from '../../common/request.service'; import {User} from './user'; const template = require('./users.template.html'); const style = require('./style.css'); @Component({ selector: 'dashboardUsers', template: template, providers: [RequestService], directives: [ ROUTER_DIRECTIVES, DataTable, Column, TabPanel, TabView, Header, Footer, Dialog, Button, InputText] styles: [style] }) export class DashboardUsersComponent implements OnInit { response: string; api_path: string; users: User[]; cols: any; displayableUser: User = new DisplayableUser(); selectedUser: User; displayDialog: boolean; newUser: boolean; count: number; next: string; previous: string; constructor(public router: Router, public requestService: RequestService) { this.api_path = 'http://127.0.0.1:8000/users/'; }