我在PrimenNG上遇到了一些问题,请看一下这个,并给我一些建议,谢谢! 我的ts文件:

import { Component } from '@angular/core';
import { CommonModule } from '@angular/common';
import { CalendarModule } from 'primeng/calendar';

@Component({
  selector: 'app-text-field',
  standalone: true,
  imports: [CommonModule,CalendarModule],
  templateUrl: './text-field.component.html',
  styleUrl: './text-field.component.css'
})
export class TextFieldComponent {

}

HTML文件:

<p-calendar></p-calendar>

程序包文件:

 "dependencies": {
    "@angular/animations": "^17.0.0",
    "@angular/common": "^17.0.0",
    "@angular/compiler": "^17.0.0",
    "@angular/core": "^17.0.0",
    "@angular/forms": "^17.0.0",
    "@angular/platform-browser": "^17.0.0",
    "@angular/platform-browser-dynamic": "^17.0.0",
    "@angular/router": "^17.0.0",
    "primeng": "^17.3.3",
    "rxjs": "~7.8.0",
    "tslib": "^2.3.0",
    "zone.js": "~0.14.2"
  },

当页面运行时,日历不工作,它显示以下错误:

ERROR Error: NG05105: Unexpected synthetic listener @overlayAnimation.start found. Please make sure that:
  - Either `BrowserAnimationsModule` or `NoopAnimationsModule` are imported in your application.
  - There is corresponding configuration for the animation named `@overlayAnimation.start` defined in the `animations` field of the `@Component` decorator (see https://angular.io/api/core/Component#animations).
    at checkNoSyntheticProp (platform-browser.mjs:762:11)
    at NoneEncapsulationDomRenderer.listen (platform-browser.mjs:726:86)
    at listenerInternal (core.mjs:24549:40)
    at ɵɵlistener (core.mjs:24430:5)
    at Calendar_div_3_Template (primeng-calendar.mjs:1287:8)
    at executeTemplate (core.mjs:12154:9)
    at renderView (core.mjs:15272:13)
    at createAndRenderEmbeddedLView (core.mjs:19737:5)
    at TemplateRef2.createEmbeddedViewImpl (core.mjs:28018:31)
    at ViewContainerRef2.createEmbeddedView (core.mjs:19901:37)

我该如何解决这个问题?谢谢!

推荐答案

请确保您已在bootstrapApplication的环境提供程序数组中添加了provideAnimations

import { provideAnimations } from '@angular/platform-browser/animations';
...
bootstrapApplication(App, {
  providers: [
    ...
    provideAnimations(),
    ...
  ]
});

我们也不应该在Angular 应用程序的任何地方有浏览器动画模块!

Angular相关问答推荐

将Angular Metal的芯片组件集成到我的表单中时出错

如何在Angular应用程序部署中安全地管理环境变量

为什么当我在父组件中设置数组元素时,Angular重新创建子组件而不是更新它?

Angular:将服务注入非独立组件导致应用程序中断

Angular :为什么我得到了一个可观察到的共鸣

如何在Primeng中实现自定义排序

所有返回缺少权限或权限不足的FireBase项目.

一次重定向后,所有子路由都处于活动状态

对REST后端的Angular/Priming过滤器请求导致无限循环

ngrx 效果等到从初始值以外的其他状态收到响应

刷新页面导致 401 错误-Angular 8

如何从表单组中禁用的表单控件中获取值?

如何 use/import http模块?

如何检测滚动到html元素的底部

如何在插值中编写条件?

angular4应用程序中输入的最小值和最大值

使用 formControlName 和 ngModel 的Angular 6 警告

如何在 ANGULAR 2 中提交表单时重置表单验证

如何提高 Angular2 应用程序的加载性能?

我应该在 Angular 4+ 应用程序中 for each 组件创建一个模块吗?