Angular 9에서 Dom에서 요소를 제거하는 방법

bilpor 에 게시 Dev

빌 포르

그래서 내 html 파일에 다음이 있습니다.

<div *ngIf="loading" class="navbar-loading"></div>

내 구성 요소 파일에는 다음이 있습니다.

public loading: Subject<boolean> = new  BehaviorSubject(true);

public ngAfterViewInit() {
    this.loading.next(false);
}

페이지가 완료되면 내 div가 여전히 페이지에 있고 콘솔 오류가 표시되지 않습니다.

위를 다음과 같이 변경하면

public loading: boolean = true;

public ngAfterViewInit() {
        this.loading = false;
}

그런 다음 div가 이동하는 것처럼 보이지만 콘솔 오류가 발생합니다.

오류 오류 : ExpressionChangedAfterItHasBeenCheckedError : 확인 후식이 변경되었습니다. 이전 값 : 'true'. 현재 값 : 'false'

로드가 완료되고 콘솔 오류가 수신되지 않을 때 div를 제거하려면 어떻게해야합니까? 자동화 테스트 목적으로 필요합니다.

데이비드

에서 아무것도 변경하면 안됩니다 ngAfterViewInit.

꼭 ChangeDetectorRef필요한 경우 angular에 무언가 변경되었다는 사실을 알리는 데 사용할 수 있습니다. 그러면 오류가 사라집니다.

constructor(private  cdr: ChangeDetectorRef){}

public ngAfterViewInit() 
{
  this.loading.next(false);
  this.cdr.detectChanges();
}

Observable을 사용하는 경우 async파이프 도 사용해야합니다.

<div *ngIf="loading | async" class="navbar-loading"></div>

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정2021-01-21

0리뷰

로그인참여 후 검토

TOP 리스트