小编woo*_*ncl的帖子

目前正在尝试使用ng2的内置animations组件在我的Angular2站点中实现一些动画.到目前为止,我一直在研究Developer Guide - Animations文档中提供的Angular 2 .虽然我遇到了一些问题,但我希望SO社区能够提供帮助.我的第一个问题/问题似乎是动画(我能说的)不能运行页面加载.如果我切换到视图然后回到带有动画的视图,它似乎运行得很好.这是我目前用于相关动画的代码(如果需要,我可以提供整个组件):

animations: [
  trigger('kissState', [
    state('in', style({opacity: 1})),
    transition('void => *', [
      style({opacity: 0}),
      animate('250ms ease-in-out')
    ]),
    transition('* => void', [
      animate('250ms ease-in-out', style({opacity: 0}))
    ])
  ])
]

我的印象是void => *将我的DOM元素设置为,opacity:0并且一旦它进入in视图就会opacity:1.我似乎遇到的另一个问题是我的导航似乎不适用于移动设备.我实际上还没有把它们移到我的服务器上,但是在本地开发并通过节点查看我的移动设备localtunnel似乎没有任何动画.这可能是因为奇怪的方式localtunnel运行所以我不太关心它,直到我能在真正的服务器上真正测试它.这是另一个动画,特别是当我注意到它不能在我的移动设备上运行时:

animations: [
  trigger('offScreenMenu', [
    state('inactive', style({
      opacity: 0,
      zIndex: -10
    })),
    state('active',   style({
      backgroundColor: 'rgba(255, 255, 255, 0.8)',
      zIndex: 10
      })),
    transition('inactive => active', animate('250ms ease-in')),
    transition('active => …