【angular】如何使用primeNG组件库

前端之家收集整理的这篇文章主要介绍了【angular】如何使用primeNG组件库前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

primeNG

primeNG为我们提供了强大、美观的组件,但是怎么用呐?也是很简单的,但是前几天为选课界面添加提示框时出错了,弹出框就没有问题,但是选课那么一个千钧一发的时刻弹出框多耽误事,怎么添加呐?
添加方法目前用到的都是一样的,举例一二:

折叠panel:
我这里用的不是panel而是旗下的Accordion:如何使用——很简单

ts中

import { AccordionModule } from 'primeng/primeng';

module中

import { AccordionModule } from 'primeng/primeng';//冯静姣-折叠
……
 imports: [
    FormsModule,……
    AccordionModule
  ],
 <p-accordion> <!-- qt是题型 单选、多选、填空等 题干集合questionMainModelList --> <div *ngFor="let qt of exampaper.paperQuestionTypeList; let i=index"> <div class="cards"> <p-accordionTab header="{{USN[i]+qt.questionTypeName}}" [selected]="true"> <!-- qm是具体的每一道题 填空第一题、第二题、第三题 --> <div *ngFor="let qm of qt.questionMainModelList; let j=index"> <!-- 题干没有有子题干 --> <div *ngIf="qm.questionSubEntityList[0]"> <div id="{{'card'+qm.id}}" class="card" (click)="locateQuestion($event.target.id)">{{j+1}}</div> </div> <!-- 题干 有子题干 --> <div *ngIf="!qm.questionSubEntityList[0]"> <!-- 遍历子题干 显示 --> <div *ngFor="let qs of qm.smallquestionMainList; let k=index"> <div id="{{'card'+qs.id}}" class="card" (click)="locateQuestion($event.target.id)">{{k+1}}</div> </div> </div> </div> <div style="clear:both;"></div> </p-accordionTab>

用 圈起来要折叠的东西,并设置第一个的[selected]=”true”

提示框——同理可得

原文链接:https://www.f2er.com/angularjs/144894.html

猜你在找的Angularjs相关文章