角度 5 中的 css 过渡不起作用

Question

我有一些 css 过渡，但是当我从一个页面转到另一个页面时，它们不起作用，它们仅在我重新加载页面时起作用，我留下了一些示例图像。有人可以帮助我吗？

需要注意的是，过渡是在 CSS 文件中的。

.login-page .login-form {
  position: relative;
  padding-top: 60px;
  -moz-transition: all 550ms ease-in-out;
  -webkit-transition: all 550ms ease-in-out;
  -o-transition: all 550ms ease-in-out;
  transition: all 550ms ease-in-out;
}

<div class="login-form">
  <div class="login-content">
    <form method="post" role="form" action="#" autocomplete="off">
      <div class="form-group">
        <div class="input-group">
          <div class="input-group-addon">
            <i class="entypo-user"></i>
          </div>
          <input type="text" name="name" id="name" class="form-control" placeholder="Nombre"/>
        </div>
      </div>
      <div class="form-group">
        <div class="input-group">
          <div class="input-group-addon">
            <i class="entypo-mail"></i>
          </div>
          <input type="email" name="email" id="email" class="form-control" placeholder="Correo electronico"/>
        </div>
      </div>
      <div class="form-group">
        <div class="input-group">
          <div class="input-group-addon">
            <i class="entypo-lock"></i>
          </div>
          <input type="password" name="password" id="password" class="form-control" placeholder="Contraseña"/>
        </div>
      </div>
      <div class="form-group">
        <div class="input-group">
          <div class="input-group-addon">
            <i class="entypo-lock"></i>
          </div>
          <input type="password" name="repear-password" id="repeat-password" class="form-control" placeholder="Repita su contraseña"/>
        </div>
      </div>
    </form>
  </div>
</div>

Answer 1

您的 css 似乎没有复制到下一页。 因此，当您路由到下一页时，请调用函数 windows.reload() [**不记得确切的函数名称]。这将解决过渡问题。 如需参考，请查看此。
Reload Angular