2015-06-26 12 views
7

Có thể thêm NG animate vào một phần tử theo cách thủ công không?Thêm ng animate một cách thủ công vào phần tử

Ví dụ: tôi muốn thêm ng-enter và ng-leave khi một lớp ng được thêm hoặc xóa. Nhưng tôi cũng cần các lớp ng-enter-active và ng-leave-active cho phép tôi kiểm soát nhiều hơn quá trình hoạt hình.

+3

Bạn có thể cho biết thêm thông tin về vấn đề của bạn –

+0

Vì vậy, những gì tôi muốn là khi ví dụ tôi bấm vào một nút ng nhập sẽ được thêm vào một yếu tố và sau khi hình ảnh động đã hoàn tất nó sẽ thêm cũng thêm ng -enter-active class (hoặc cách khác xung quanh tôi đã quên). Điều này cho phép tôi kiểm soát nhiều hơn hoạt ảnh. –

Trả lời

0

Không thể xóa chỉ thị dựa trên sự thay đổi lớp trong lớp ng. Tuy nhiên vì bạn đang áp dụng một lớp trong lớp ng dựa trên một điều kiện, bạn có thể sử dụng cùng một biểu thức đó trong ng-if để bao gồm ng-enter hoặc ng-leave.

+0

Nhưng điều tôi thực sự muốn là hành vi của góc cạnh để thêm ng-enter-active hoặc ng-leave-active. –

+0

Bạn có thể đặt mã của bạn trên plunker? –

3

Có, bạn có thể. Nhưng bạn phải làm một số thủ thuật ở đây như sau.

Sử dụng https://daneden.github.io/animate.css/ cho đơn đăng ký của bạn. Nó có hình động đẹp theo mặc định. Nếu bạn thêm phần tử này vào phần tử của mình, bất cứ khi nào phần tử được chèn vào dom, sẽ có một hoạt ảnh.

Nhưng ở đây trong kịch bản của bạn, hãy thêm lớp animate bất cứ khi nào bạn thêm hoặc xóa lớp học khỏi các phần tử dựa trên điều kiện của bạn. Mã mẫu dưới đây.

<div ng-class="AddClass?'yourClass animated fadeIn':'animated fadeOut removedClass'"> 
</div> 
+0

Nhưng theo cách này, nó không thêm các lớp ng-enter, ng-enter-active, ng-leave và ng-leave-active. Đây là những lớp tôi cần cho hoạt ảnh nâng cao hơn. –

Các vấn đề liên quan