You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

PrimeNG Sidebar组件头部内容不显示问题求助

PrimeNG Sidebar头部内容不显示的排查与解决
  • 直接原因:模板指令拼写错误
    你代码里的p-Template="header"是错误写法,PrimeNG的模板指令应为pTemplate(驼峰格式,无连字符),这是头部内容无法渲染的核心问题。

  • 修正后的完整代码

    <p-sidebar [(visible)]="visibleSidebar1">
      <ng-template pTemplate="header">
        <p>Header</p>
      </ng-template>
      My content goes here
    </p-sidebar>
    
  • 若修正后仍异常的排查方向

    • 确认PrimeNG版本兼容性:PrimeNG 14+版本的Sidebar完全支持pTemplate插槽写法,旧版本可对应官方文档确认语法细节。
    • 检查模块导入:确保你的Angular模块中已正确导入SidebarModule,否则组件功能无法正常工作。
    • 排查样式冲突:如果头部内容实际存在但不可见,检查是否有自定义CSS覆盖了Sidebar头部的默认显示样式。

内容的提问来源于stack exchange,提问作者Vino

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.11 06:35:30