PrimeNG手风琴无法正常工作并无法正常显示

时间:2018-07-30 18:28:46

标签: css angular angular6 primeng

我尝试根据official documentation

使用primeNG手风琴

这是我的代码:

<p-accordion [multiple]="true">
    <p-accordionTab header="Godfather I">
        The story begins  as Don Vito Corleone, the head of a New York Mafia family, overseeshis daughter's wedding. His beloved son ichael has just come home from the war, but does not intend to become part of his father's business. T hrough Michael's life the nature of the family business becomes clear. The business of the family is just like the head of the family, kind and benevolent to those who give respect, but given to ruthless violence whenever anything stands against the good of the family.
    </p-accordionTab>
    <p-accordionTab header="Godfather II">
        Francis Ford Coppola's legendary continuation and sequel to his landmark 1972 film, The_Godfather parallels the young Vito Corleone's rise with his son Michael's spiritual fall, deepening The_Godfather's depiction of the dark side of the American dream. In the early 1900s, the child Vito flees his Sicilian village for America after the local Mafia kills his family. Vito struggles to make a living, legally or illegally, for his wife and growing brood in Little Italy, killing the local Black Hand Fanucci after he demands his customary cut of the tyro's business. With Fanucci gone, Vito's communal stature grows.
   </p-accordionTab>
    <p-accordionTab header="Godfather III">
        After a break of more than  15 years, director Francis Ford Coppola and writer Mario Puzo returned to the well for this third and final story of the fictional Corleone crime family. Two decades have passed, and crime kingpin Michael Corleone, now divorced from his wife Kay has nearly succeeded in keeping his promise that his family would one day be completely legitimate.
    </p-accordionTab>
</p-accordion>

我确保import { AccordionModule } from 'primeng/accordion'和导入AccordionModule在app.module.ts中

问题1 :我有一个错误:ERROR Error: "Found the synthetic listener @tabContent.done. Please include either "BrowserAnimationsModule" or "NoopAnimationsModule" in your application."

我实际上是否需要包含BrowserAnimationsModuleNoopAnimationsModule?官方文档中没有提及

问题2 :我添加了NoopAnimationsModule,现在问题已经解决了,但显示效果令人恐惧。

似乎手风琴的内容和标题是重叠的: enter image description here

一个选项卡处于活动状态: enter image description here

请帮助。如果有任何滥用,请随时纠正我。 预先谢谢你!

2 个答案:

答案 0 :(得分:1)

内容没有隐藏的问题是因为页面中没有Private Sub CopyToDest_Click() Dim destWbk As Workbook Dim sourceWbk As Workbook Dim shName As Variant Dim filePath As Variant Application.ScreenUpdating = False Application.DisplayAlerts = False 'Set source and dest sheets Set sourceWbk = ThisWorkbook filePath = Sheet29.Range("D6").Value Set destWbk = Workbooks.Open(filePath) shName = Sheet29.Range("J12").Value 'Copy sheet from source file to destination sheet sourceWbk.Sheets(shName).Copy After:=destWbk.Sheets("Total") destWbk.Save destWbk.Close 'Delete copied sheet from source file Sheets(shName).Select ActiveWindow.SelectedSheets.Delete Application.ScreenUpdating = True Application.DisplayAlerts = True MsgBox "Sheet Copied Successfully", vbInformation, "Success" End Sub ,PrimeNG组件自动将一组固定的css类应用于它们的组件,在您的情况下,这是以下类负责隐藏您的手风琴面板的内容:

primeng.css

答案 1 :(得分:0)

在评论部分感谢David和Daniel。

对于问题1:是的,我需要导入BrowserAnimationsModule

对于问题2:primeng.min.css丢失。我必须在angular.json中添加<link rel="stylesheet" type="text/css" href="/node_modules/primeng/resources/primeng.min.css" />