要在Angular中使用关键帧动画并停留在最后位置,可以按照以下步骤进行操作:
@keyframes fade-in {
from { opacity: 0; }
to { opacity: 1; }
}
.fade-in {
animation: fade-in 1s;
}
Hello, World!
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-example',
templateUrl: './example.component.html',
styleUrls: ['./example.component.css']
})
export class ExampleComponent implements OnInit {
animate: boolean = true;
ngOnInit() {
setTimeout(() => {
this.animate = false;
}, 1000); // 1秒后停止动画
}
}
通过这样的方式,元素将在页面加载时应用动画,并停留在最后位置。
请注意,以上示例是基于Angular 4+版本的,如果您的版本较旧,请将其更改为适合您版本的代码。