代码之家 › 专栏 › 技术社区 › ayala

AOS中的数据绑定-可能吗?

aos.js animation angular

ayala · 技术社区 · 2 年前

我在我的角度项目中使用了“滚动动画”,我有一堆图像,我想一个接一个地展示。

 <div class="img-gallery">
        <div *ngFor="let imgSrc of images" data-aos="zoom-in">
            <img [src]="imgSrc">
        </div>
    </div>

我想添加每个包装器div data-aos-delay 指令,像这样

<div *ngFor="let imgSrc of images; let i = index" data-aos="zoom-in" [data-aos-delay]="i * 100">
    <img [src]="imgSrc">
</div>

但是,意料之中的是,它向我展示了错误

无法绑定到“data aos delay”,因为它不是“div”的已知属性

无论如何,我怎样才能实现它?任何实施都将不胜感激

1 回复 | 直到 2 年前

Naren Murali 2 年前

你能把它改到下面吗

你在上也有拼写错误 index

<div *ngFor="let imgSrc of images; let i = index" data-aos="zoom-in" data-aos-delay="{{i * 100}}">
    <img [src]="imgSrc">
</div>

你也可以这样做

<div *ngFor="let imgSrc of images; let i = index" data-aos="zoom-in" [attr.data-aos-delay]="i * 100">
    <img [src]="imgSrc">
</div>

推荐文章

mikko · SwiftUI如何在不同堆栈中实现同一视图的平滑动画

1 年前

Nejib Afdhal · 如何在带有类名的react native中使用顺风动画?

1 年前

user54097 · 滚动菜单项上的导航栏动画文本徽标

2 年前

Simplicissimus · 如何使用javascript为svg转换计时

2 年前

LetsBeHappy · 高CPU的圆形渐变动画

2 年前

Toniq · css从上到中心设置动画

2 年前

Ongky Denny Wijaya · 绘制y=omega*x^2的动画,其中omega从-3到3不等

2 年前

Duck · 如何设置菜单从圆形到椭圆形的动画?

2 年前

MR Lappy · 提要动画最后出现空白

2 年前

Nithin Sai · 如何设置draggableScrollableSheet及其内容的动画?

2 年前