Observable.of (배열)가 setInterval이 실행될 때마다 업데이트됩니다.

Question

Observable.of (배열) 및 angle의 비동기 파이프를 사용할 때 이상한 동작이 발생합니다. 어쩌면 나는 그것을 잘못 사용하고 있지만 이해할 수는 없다.

Ionic 3 (angular 4)에 view.html 및 view.ts 파일이 있습니다. 나는 Observable.of (items)를하고있다. 항목은 객체가있는 배열입니다. 그리고 내 견해로는 다음과 같은 것들이 있습니다. 비동기. 모든 것이 훌륭하지만, 1000 밀리 초마다 view.ts에서 setInterval을 수행하면 1000 밀리 초마다 뷰가 업데이트됩니다. setInterval이 아무 것도하지 않을 때에도!

잘못 사용하고 있습니까? 나는 행동을 이해할 수 없다 ..!

Answer 1

OnPush 전략을 사용하십시오. 이 전략을 사용하면 영향을받은 항목, 즉 이벤트가 발생했거나 검사를 위해 표시 한 구성 요소 만 평가됩니다. 또한 항목은 얕은 모드로 비교되므로 참조 만 확인됩니다. 이를 위해서는 객체를 변경하지 않아야합니다.

ChangeArchiver/Core에서 ChangeDetectionStrategy를 가져온 다음 changeDetection : ChangeDetectionStrategy.OnPush를 @Component 데코레이터에 추가하십시오.

예를 들어 this.array.push(value) 대신 this.array = this.array.concat(value)을 사용하십시오.

값이 http 호출이나 타이머처럼 비동기 적으로 업데이트되면 ChangeDetectorRef를 추가하고 콜백에 markForCheck()을 호출하십시오.

Answer 2

setInterval 메서드는 변경 감지주기를 트리거하는 방식으로 "패치"됩니다.

자세한 내용은 here을 참조하십시오.

링크의 일부 관련 섹션 :

기본적으로 세 가지에 의해 발생할 수 있습니다 변화 애플리케이션 상태 :

이벤트 - 제출을 클릭 ...

XHR - 가져 오기 원격 서버의 데이터

타이머 - setTimeout(), setInterval()

이들은 모두 비동기입니다. 결론적으로 어떤 비동기 작업이 수행 될 때마다 기본적으로 우리의 응용 프로그램 상태가 변경되었을 수 있습니다. 이것은 누군가가 에 각도를 지정하여보기를 업데이트해야하는 경우입니다.

누구가 각을 통지합니까?

이제 응용 프로그램 상태 변경의 원인을 알았습니다. 그러나 그것은 무엇입니까? 각도,이 특정 순간에보기를 업데이트해야합니까? Angular를 사용하면 기본 API를 직접 사용할 수 있습니다. 우리가 호출해야하는 인터셉터 메소드가 없으므로 Angular는 DOM을 업데이트하도록 통지받습니다. 그게 순수한 마법인가? 최신 기사를 읽은 적이 있다면 지역에서이 문제를 처리한다는 것을 알고 계실 것입니다. 실제로 Angular는 자신의 영역 인 NgZone을 제공합니다.이 영역은 Angular의 기사 영역 에 있습니다. 당신도 그걸 읽을 수 있습니다. 짧은 버전은 Angular의 소스 코드 어딘가에 인데, NgZones onTurnDone 이벤트를 수신하는 ApplicationRef라는 것이 있습니다. 이 이벤트가 발생하면 tick() 함수를 실행하여 본질적으로 이 변경 감지를 수행합니다.