javascript 在Angular 路由器插座褪色?

piwo6bdm  于 2023-01-04  发布在  Java
关注(0)|答案(1)|浏览(130)

试图淡出角路由器插座。
这是CSS代码(app-component.css)。

router-outlet + * {
  display: block;
  animation: fade 1s;
}

@keyframes fade {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

And this is a demo.路由器插座内容没有淡入.有什么想法吗?

fnvucqvd

fnvucqvd1#

请在Angular here中阅读有关构件样式的详细信息。
以下是app.component.css CSS的编译:

但是,router-outlet的兄弟始终是RouterModule注入的不同组件。
为了解决这个问题,有两种解决方案。
1.将router-outlet + *动画css移动到styles.css文件。
1.在app.component.ts文件中添加encapsulation: ViewEncapsulation.None,如下所示。

相关问题