我用Angular -seed升级了一个Angular 4项目,现在得到了这个错误
找到合成属性@panelState。请在应用程序中包含“BrowserAnimationsModule”或“NoopAnimationsModule”。
我该如何解决这个问题?错误消息到底告诉我什么?
我用Angular -seed升级了一个Angular 4项目,现在得到了这个错误
找到合成属性@panelState。请在应用程序中包含“BrowserAnimationsModule”或“NoopAnimationsModule”。
我该如何解决这个问题?错误消息到底告诉我什么?
当前回答
当我尝试使用BrowserAnimationsModule时,我遇到了类似的问题。以下步骤解决了我的问题:
删除“node_modules”目录 使用npm cache clean清除你的包缓存 运行这里列出的两个命令中的一个来更新现有的包
如果你遇到404错误
http://.../node_modules/@angular/platform-browser/bundles/platform-browser.umd.js/animations
在system.config.js中添加以下条目:
'@angular/animations': 'node_modules/@angular/animations/bundles/animations.umd.min.js',
'@angular/animations/browser':'node_modules/@angular/animations/bundles/animations-browser.umd.js',
'@angular/platform-browser/animations': 'node_modules/@angular/platform-browser/bundles/platform-browser-animations.umd.js'
Naveedahmed1提供了这个github问题的解决方案。
其他回答
--
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
---
@NgModule({
declarations: [ -- ],
imports: [BrowserAnimationsModule],
providers: [],
bootstrap: []
})
我得到以下错误:
Found the synthetic property @collapse. Please include either "BrowserAnimationsModule" or "NoopAnimationsModule" in your application.
我遵循Ploppy接受的答案,它解决了我的问题。
以下是步骤:
1.
import { trigger, state, style, transition, animate } from '@angular/animations';
Or
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
2. Define the same in the import array in the root module.
它将解决错误。编码快乐! !
对于我来说,我错过了@Component decorator中的这句话: 动画(yourAnimation):
一旦我添加了这个语句,错误就消失了。 (角6. x)
此错误消息通常具有误导性。
你可能忘记了导入BrowserAnimationsModule。但那不是我的问题。我在根AppModule中导入BrowserAnimationsModule,就像每个人都应该做的那样。
问题与模块完全无关。我在组件模板中动画一个*ngIf,但我忘记在@Component中提到它。组件类的动画。
@Component({
selector: '...',
templateUrl: './...',
animations: [myNgIfAnimation] // <-- Don't forget!
})
如果你在模板中使用一个动画,你也必须在组件的动画元数据中列出该动画…每一次。
简单地加上.. import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
协和进口:( … BrowserAnimationsModule
],
在app.module.ts文件中。
确保您已经安装。NPM install @angular/animations@latest