primeng

How to expand row from datatable programmatically

由 ╄→гoц情女王★ 提交于 2019-12-01 03:45:05
问题 I want to expand row directly from an typescript method, i've try with @viewchild but it doesn't work : HTML: <p-dataTable [value]="array" [responsive]="true" expandableRows="true" #dt (onRowClick)="dt.toggleRow($event.data)"> <template let-test pTemplate="rowexpansion"> <div class="ui-grid ui-grid-responsive ui-fluid"> <div class="ui-grid-row"> Bouh ! </div> </div> </template> <p-column field="name" header="Vin"></p-column> <p-column field="company" header="Year"></p-column> </p-dataTable>

prime ng styles not applying angular2

由 北战南征 提交于 2019-12-01 03:34:18
Hi I just started working with angular 2. I found this library PrimeNG, I followed this tutorial: http://blog.davincisoftware.sk/primeng-web-component-framework-based-on-angularjs-2 It it all works, except the styles. They're not applying somehow and I really don't know what to do. here's 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"

How to add style class to p-dataTable row

由 落花浮王杯 提交于 2019-12-01 03:12:29
We're using p-dataTable from PrimeNG 1.0.0-beta.16 I want to add a style to the row when a value is true. I figured it out how to do this with the cell, but I need the whole row the change its background. <p-dataTable [hidden]="loading" [value]="timePeriods" scrollable="true" scrollHeight="400px" rowStyleClass="missingPeriod"> <p-column field="StartDate" header="Begindatum" sortable="false"> <template let-col let-timePeriod="rowData" pTemplate type="body"> <span [class.missingPeriod]="!timePeriod.IsNext">{{timePeriod.StartDate | date: 'dd-MM yyyy'}}</span> </template> </p-column> <p-column

PrimeNG Calendar error - JQuery is not defined

由 谁说胖子不能爱 提交于 2019-12-01 02:48:22
问题 I want to use PrimeNG calendar in my app. When I run the code, I get the error: ReferenceError: jQuery is not defined. Other PrimeNG directives work fine. If I remove <p-calendar> the error disappears. I have imported and included Calendar in my app. By the way I'm using the latest versions of angular, router and forms. Before that I had this issue and fixed it by updating form providers. <p-calendar [(ngModel)]="date"></p-calendar> Stacktrace excerpt: ReferenceError: jQuery is not defined at

prime ng styles not applying angular2

由 [亡魂溺海] 提交于 2019-11-30 23:54:20
问题 Hi I just started working with angular 2. I found this library PrimeNG, I followed this tutorial: http://blog.davincisoftware.sk/primeng-web-component-framework-based-on-angularjs-2 It it all works, except the styles. They're not applying somehow and I really don't know what to do. here's 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=

prime-ng Dropdown - disable certain SelectItems

由 北城以北 提交于 2019-11-30 23:28:51
Is there an option to disable some of prime-ng's dropdown items (SelectItems)? I notice this discussion , is something changed? here is my workaround: 1) extend original SelectItem 's interface ( reference ) with disabled property, so merged interface will look like interface SelectItem { label: string; value: any; disabled: boolean; } this may be done by declaring new interface with the same name: interface SelectItem { disabled: boolean; } 2) based on p-dropdown component's template , modify this part of template: <li *ngFor="let option of optionsToDisplay;let i=index" [ngClass]="{'ui

How to add style class to p-dataTable row

由 早过忘川 提交于 2019-11-30 22:27:31
问题 We're using p-dataTable from PrimeNG 1.0.0-beta.16 I want to add a style to the row when a value is true. I figured it out how to do this with the cell, but I need the whole row the change its background. <p-dataTable [hidden]="loading" [value]="timePeriods" scrollable="true" scrollHeight="400px" rowStyleClass="missingPeriod"> <p-column field="StartDate" header="Begindatum" sortable="false"> <template let-col let-timePeriod="rowData" pTemplate type="body"> <span [class.missingPeriod]="

Map an object to another in Typescript

由 ╄→尐↘猪︶ㄣ 提交于 2019-11-30 19:09:22
问题 I have a role object that I wanted to map to a TreeNode object using PrimeNG to display it in a tree. The role object is something like this (shown in the picture as well) role: [ id: .... name: .... description: .... roles[]: ..... ] The tree node object has the following structure is: { "data": [ { "label": "Documents", "data": "Documents Folder", "expandedIcon": "fa-folder-open", "collapsedIcon": "fa-folder", "children": [{ "label": "Work", "data": "Work Folder", "expandedIcon": "fa-folder

prime-ng Dropdown - disable certain SelectItems

由 ♀尐吖头ヾ 提交于 2019-11-30 17:18:47
问题 Is there an option to disable some of prime-ng's dropdown items (SelectItems)? I notice this discussion, is something changed? 回答1: here is my workaround: 1) extend original SelectItem's interface (reference) with disabled property, so merged interface will look like interface SelectItem { label: string; value: any; disabled: boolean; } this may be done by declaring new interface with the same name: interface SelectItem { disabled: boolean; } 2) based on p-dropdown component's template,

How to lazy load Angular 2 components in a TabView (PrimeNG)?

由 ぃ、小莉子 提交于 2019-11-30 13:29:51
问题 It is my app.component.ts: import { Component } from '@angular/core'; @Component({ templateUrl: 'app/app.component.html', selector: 'my-app' }) export class AppComponent { } And this is my app.component.html: <p-tabView> <p-tabPanel header="Home" leftIcon="fa-bar-chart-o"> <home-app></home-app> </p-tabPanel> <p-tabPanel header="Hierarquia" leftIcon="fa-sitemap"> <tree-app></tree-app> </p-tabPanel> <p-tabPanel header="Configurações" leftIcon="fa-cog"> <config-app></config-app> </p-tabPanel> <
订阅 primeng