如何在角度中使用CSS进行滑动？

Question

考虑以下plunker

我试图在输入时留下号码列表，并在离开时向左滑动。

这是我的css

.stuff {
  display: inline-block;
  margin-left: 10px;
}

button {
  display: block;
}

.stuff.ng-enter,
.stuff.ng-leave {
    -webkit-transition: all 1s ease-in-out;

}

.stuff.ng-enter {
    left: 100%;
}
.stuff.ng-enter-active {

    left: 0;
}

.stuff.ng-leave {
    left: 0;
}
.stuff.ng-leave-active {
    left: -100%;
}

我确认如果我将定位过渡更改为不透明度，则可以使用，但出于某种原因，动画left或right不起作用。

有人能帮助我吗？

由于

Answer 1

只是查看了您的代码，我建议您将position添加到您的样式中。您可以找到更改here

我只是对班级进行了一些小改动。

.stuff.ng-enter,.stuff.ng-leave {

 -webkit-transition: all 1s ease-in-out;
 position:relative;

}

希望这能回答这个问题。