相对于视口角度6的位置元素

Question

在我的项目中，我想从单击位置放置元素。现在，一个模态弹出窗口打开并向下推动内容。当此内容关闭时，下一个模态将再次被拉起，因为它的位置是相对的。我最理想的目标是使所有模态保持点击状态，顶部位置将其他模态向下拉。

我正确地获得了元素的顶部位置，但是当我使用.css时，我得到了ERROR TypeError: this.singleQuestion.nativeElement.css is not a function。有没有办法修复此代码或设置相对于视口的顶部位置。

public toggle() {
            this._active = !this._active;
            if (this._active) {
                const top = this.singleQuestion.nativeElement.getBoundingClientRect().top;
                this.singleQuestion.nativeElement.css({top: top});
            }
            this.clickEvent.emit((this._active) ? this._question : null);
        }

Answer 1

有更好的滚动版本

scroll(): void {
    ...
    const top = this.singleQuestion.nativeElement.getBoundingClientRect().top;
    window.scrollTo({top: top, left: 0, behavior: 'smooth'});
    ....
}

但是，如果您只想设置y位置，则可以使用

this.singleQuestion.nativeElement.offsetTop = top;

或

this.singleQuestion.nativeElement.style.top = top;