Question

当内容使用angular 5+ no jquery滚动到视图中时如何添加和删除类。

我要在div滚动后动画（溢出：自动；）

哪种动画库可用于此类动画？

Answer 1

在这种情况下，您可以做的是为滚动添加一个事件

对于滚动事件

import { Component, OnInit } from '@angular/core';
import { HostListener, Inject } from "@angular/core";
import { DOCUMENT } from '@angular/platform-browser';

declare const window: any;

@Component({
    selector: 'app',
    templateUrl: 'app.component.html',
    styleUrls: ['app.css'],
})

export class AppComponent implements OnInit {

  constructor(){

  }

  ngOnInit() {}


  @HostListener("window:scroll", [])
  onWindowScroll() {

    const number = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0;
    if (number > 100) {
      console.log('You are 100px from the top to bottom');
    } else if (number > 500) {
        console.log('You are 500px from the top to bottom');
    }

  }

}

对于变更班

[ngClass]="{ 'active': myString == ThisIsActiveString }";

现在滚动更改班级

当内容使用Angular 5+ no jquery滚动到视图时如何添加和删除类

1 个答案: