'Encontré la propiedad sintética @panelState. Incluya "BrowserAnimationsModule" o "NoopAnimationsModule" en su aplicación.
Actualicé un proyecto de Angular 4 usando angular-seed y ahora aparece el error
Encontré la propiedad sintética @panelState. Incluya "BrowserAnimationsModule" o "NoopAnimationsModule" en su aplicación.
¿Cómo puedo arreglar esto? ¿Qué me dice exactamente el mensaje de error?
Asegúrese de que el @angular/animationspaquete esté instalado (por ejemplo, ejecutando npm install @angular/animations). Luego, en tu app.module.ts
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
@NgModule({
...,
imports: [
...,
BrowserAnimationsModule
],
...
})
Este mensaje de error suele ser engañoso .
Es posible que haya olvidado importar el archivo BrowserAnimationsModule. Pero ese no fue mi problema . Estaba importando BrowserAnimationsModuleen la raíz AppModule, como debería hacer todo el mundo.
El problema era algo que no tenía ninguna relación con el módulo. Estaba animando una *ngIfen la plantilla del componente pero me había olvidado de mencionarlo en la @Component.animations clase del componente .
@Component({
selector: '...',
templateUrl: './...',
animations: [myNgIfAnimation] // <-- Don't forget!
})
Si usa una animación en una plantilla, también debe incluir esa animación en los animationsmetadatos del componente... cada vez .
Me encontré con problemas similares cuando intenté usar BrowserAnimationsModule. Los siguientes pasos resolvieron mi problema:
- Eliminar el directorio node_modules
- Borre la caché de su paquete usando
npm cache clean - Ejecute uno de estos dos comandos enumerados aquí para actualizar sus paquetes existentes
Si experimenta errores 404 como
http://.../node_modules/@angular/platform-browser/bundles/platform-browser.umd.js/animations
agregue las siguientes entradas mapen su 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 proporcionó la solución a este problema de github .
