angualr2에서 UI 렌더링 제어

Question

초기 화면을 만들려면 UI에 변경 사항을 적용하는 데 필요한 서비스 및 기반을 호출해야합니다. 이제 UI에서 응답을 받기 전에 내보기가 렌더링되지 않게하는 것이 좋습니다.

UI가 렌더링되지 않도록하고 서비스에서 응답을받은 후에 값을 설정 한 후에 UI에 렌더링을 요청할 수 있습니까?

도움이 매우 좋습니다.

Answer 1

lifecycle documentation에서 볼 수 있듯이 ngOnChanges에서 변경하면 매번 호출되기 때문에 렌더링 전에 연결 고리를 배치 할 방법이 없습니다.

뷰 렌더링이 필요한 이유를 모르겠지만 잘못된 문제입니다. 각도 2는 언제든지보기를 관리 할 수 ​​있기 때문에 *ngIf, *ngSwitchCase과 같은 도구를 사용하여 렌더링 한 경우에도 언제든지보기를 수정할 수 있습니다.

로직을 ngOnInit 메서드에 바인딩하고 구성 요소에서 변수를 변경하여 뷰가 데이터를 갖자 마자 즉시 업데이트되도록해야합니다.

<div *ngIf="init"> 
... 
... 
... 
</div> 

을 그리고 약속이 완료되면 다음을 수행 할 수 있습니다 그밖에

당신이 정말 서비스의 약속이 완료되는 경우에만 렌더링 할 뷰를 원한다면, 당신은 *ngIf A의 구성 요소의 템플릿을 포장 할 수 있습니다 true로 init을 설정

export class ExampleComponent implements OnInit{ 

    init:boolean=false; 

    constructor(private service:FooService){} 

    ngOnInit():void{ 
     service.bar(...).then(() => 
      { 
       ... 
       this.init = true; 
       ... 
      } 
    } 
} 

Answer 2

를 그것은 단지 당신의 intial 화면을 우려하는 경우 유사한 문제에 티에리 Templier answer 보라 : 응용 프로그램을 렌더링하기 전에 비동기 서비스의 응답을 기다리는.

라우터가이 페이지를로드하는 경우 각도 라우터 resolve guard을 사용하여 경로로 대상이되는 구성 요소를 렌더링하기 전에 일부 비동기 호출을 기다릴 수 있습니다.