Question

Angular 5 - Chrome。

我正在寻找停止跳页的建议。我有一个连接到ngFor循环的表。如果我位于页面顶部并执行向数组添加元素的操作，那么当时具有ngFor循环的表格不在屏幕上（进一步向下但在视图之外），页面从字面上跳到那张桌子，向我展示添加的元素。对于最终用户来说，这显然非常烦人，我想知道如何阻止这种情况发生。

我只注意到没有最大高度和overflow-y: auto的表格。你可能会说桌子有一个最大高度和溢出。这很好，直到我有嵌套表，然后滚动自己很烦人。试图摆脱这种解决方案。

Answer 1

我发现了这个错误。我认为它与角度5有关。

在我的app.ts页面中，我使用了一个函数来获取视图高度以及导航栏高度。

getViewHeight() {

    let res = this.windowSizeHeight - this.el_navBarMain.nativeElement.clientHeight - 20;

    if (this.status) {
        res -= 40;
    }

    if (!this.isConnected()) {
        res -= 40;
    }

    return res;
}

在我的HTML中，我这样做：

<div class="col-sm-12" style="overflow-y: scroll;" [style.height.px]="getViewHeight()">
    <router-outlet></router-outlet>
</div>

此功能是导致此错误的原因。所以我所做的就是制造变量，并采用这种方式：

<div class="col-sm-12" style="overflow-y: scroll;" [style.height.px]="windowSizeHeight - navbarMainHeight - statusHeight - connectedHeight - 20">
    <router-outlet></router-outlet>
</div>

现在页面没有跳转。为什么在世界上一个函数做同样的事情导致它跳转但是使用变量不？我控制台从getViewHeight（）记录了res变量，它没有改变或闪烁为0或类似的东西。奇怪的东西。

Angular 5 Page跳跃循环

1 个答案: