Question

我需要使用jquery将Angular2插件应用于Typescript中的单选按钮。

如果我在ngAfterViewChecked中分配，则会多次调用它，并且控件会多次刷新。

在DOM准备好之后调用javascript方法的替代解决方案是什么？

Answer 1

试试ngAfterViewInit并查看here和here。

Answer 2

当我依赖DOM准备好时，我一直在使用ngAfterViewChecked。

import {Component, AfterViewChecked} from '@angular/core'; 

export class NavBar implements AfterViewChecked{

   ngAfterViewChecked(){
      // jquery code here
   }
}

Answer 3

一旦DOM树得到任何改变，就会调用ngAfterViewChecked（）。

因此，如果DOM树多次更改，则会多次调用ngAfterViewChecked（）方法。

建议不要将业务逻辑放在此方法中。但是只有屏幕刷新相关的逻辑，比如在新消息进入时将窗口滚动到底部。

Answer 4

我不确定您需要做什么和/或实现什么，但是我将向您展示针对类似用例的解决方案。

我的问题是我需要在加载时向下滚动div。 AfterViewChecked被执行了多次，但是在这个生命周期中我需要向下滚动。那就是我所做的，也许对您有帮助：

    public scrollSuccessfull = false; // global variable


    public ngAfterViewChecked(): void {
        if (!this.scrollSuccessful) {
          // gets executed as long as the scroll wasnt successfull, so the (successful) scroll only gets executed once
          this.scrollSuccessful = this.scrollToBottom(this.internal ? this.internalChatDiv : this.externalChatDiv);
        }
      }

    private scrollToBottom(element: ElementRef): boolean {
        if (element) {
          element.nativeElement.scrollTop = element.nativeElement.scrollHeight;
          return element.nativeElement.scrollTop !== 0;
        }

        return false;
      }

Angular2 - ngAfterViewChecked被多次调用..如何在DOM完全加载后调用一次方法？

4 个答案: