IT이야기

관찰 가능한 테이크아웃 취소작동하지 않을 때까지

cyworld 2022. 3. 27. 14:17
반응형

관찰 가능한 테이크아웃 취소작동하지 않을 때까지

자동 완성 HTTP 호출과 검색 HTTP 호출 실행...실행 작업이 트리거될 때 자동 완성 호출을 중단해야 한다.내가 지금 하고 있는 것은 다음과 같은 주제를 사용하는 것이다.

private onExecute$ = new Subject();

자동 완성 방법:

executeAutoComplete(e) {
  this.myService.searchAutoComplete(e.criteria)
  .pipe(
   takeUntil(this.onDestroy$),
   takeUntil(this.onExecute$),
   map( 
  // continue with more code

그리고 내 실행 방법에서 신호를 올린다:

executeSearch(e) {
console.log('triggering onExecute signal');
this.onExecute$.next();
  // other code
}

콘솔에서 '실행 신호에 트리거 중'이 표시되지만 전체 검색이 실행된 후 자동 완성 결과가 반환됨 신호를 올리면 체인을 중단할 때까지?그것은 효과가 없다.

따라서 본질적으로 내가 방지하려는 행동은 자동 완성 결과가 더 이상 관련이 없기 때문에 사용자에 의해 검색이 트리거될 때 드롭다운을 열어서는 안 된다는 것이다.

내가 뭘 놓쳤지?

편집 -

순서는 자동 완성 전에 실행이 항상 호출되는 디바운스 시간 때문에 이슈에 영향을 미친다. 순서는 예측할 수 없는 길일 수 있다.관찰 가능한 체인이 아직 활성화되지 않은 경우 onExecute.next()가 손실된다는 것을 알지 못함.

searchLoading 변수도 설정되어 있는데, 이 변수를 사용하려면 어떻게 해야 할까?

나는 노력했다:

takeUntil(Observable.of(this.searchLoading))

이것은 항상 사실이기 때문에 효과가 없다!동적으로 평가되는 부울 값을 사용하여 takePill을 사용하는 방법

편집 2 -

테이크를 사용하여 얻었다.대신:

takeWhile(() => !this.searchLoading))

그럴 수도 있을까?executeSearch전에 불려지다executeAutoComplete만약onExecute$검색 실행을 중지하지 않는 관측 가능한 체인이 구성되기 전에 값을 이미 내보냈다.

그런데, 내가 보기에는 전화를 거는 것이 더 간단할 것 같다.unsubscribe검색 실행 시 구독에 추가하십시오.

나쁜 소식은 효과가 있다는 거야

네 코드의 이 근사치를 이용해서 결점을 찾으려고 했는데 아쉽게도 못 찾겠어.
누군가에게 유용할 경우를 대비해서 여기에 올린다.

console.clear()

const takeUntil = Rx.operators.takeUntil;

const onDestroy$ = new Rx.Subject();
const onExecute$ = new Rx.Subject();

const source$ = Rx.Observable.timer(0,1000)
const executeAt$ = Rx.Observable.timer(3000)

executeAt$
  .subscribe(x => {
     console.log('execute');
     onExecute$.next(); 
   })

source$
  .pipe(
    takeUntil(onDestroy$), 
    takeUntil(onExecute$)
  )
  .subscribe(console.log)
<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/5.5.2/Rx.js"></script>

을 주제로unsubscribe()takeUntil()Ben Lesh는 '구독을 취소하지 말라'에서 말한다.

너무 많은 구독 개체를 주변에 보관하는 것은 구독을 반드시 관리하고 Rx의 힘을 이용하지 않는 표시입니다.

그리고

TakePill을 사용하여 구독 관리 구성


각주 - 서비스 인스턴스

Rx 코드가 정상으로 보인다면, 또 다른 가능한 원인은 각도 서비스의 여러 인스턴스 때문이다.

만약private onExecute$ = new Subject();서비스로 포장되어 있으며, 두 개의 어레이(모듈 + 구성 요소 또는 두 개의 구성 요소)를 제공하는 서비스가 있고, 그 다음에 호출하는 인스턴스가 있음.next()on은 에 사용된 인스턴스와 다를 수 있다.takeUntil().

그것은 장황한 일이고, 위의 당신의 코드는 그것이 사실이 아니라는 것을 나타내지만, 꽤 흔한 일처럼 보인다.

그것은 오래되었지만 나는 같은 세나리오를 가지고 있었다.

takePill을 사용하려면 ReplaySubject가 올바른 제목이다.

  • 왜냐하면, 제목이 통화하기 전까지 어떤 것을 방출하는 경우, 제목에 가입할 때까지(실행 시) 다시 수신되지 않으며, 테이크 벨은 출처를 등록 취소하지 않을 것이기 때문이다.
  • 반대로 ReplaySubject는 구독 시 다시 가입하므로 takeEntery는 내부 구독 취소 통화와 함께 취소된다.

내 경우에는 문제가 있었다.this.destroy$.complete();나는 많은 구성 요소에서 호출된 서비스에서 구독을 사용하고 있었다.그리고 컴포넌트 OnDestroy 훅에서 서비스 중인 구독을 서비스 방법으로 중지시키려 했다.

destroySubscriptions() {
    this.destroy$.next();
    this.destroy$.complete();
}

그러나 첫 번째 구성 요소가 가입을 중지하고 완료한 후destroy$제목, 다음 구성 요소는 다음 이유로 서비스 중인 구독을 중지할 수 없음destroy$주제가 이미 완료되었고this.destroy$.next();아아도 취도 취도 취지도 취다. 않을 그러니 이 주제를 완성하여 주의하십시오. 더 이상 작동하지 않을 겁니다. 것 )그랬어 ㅎㅎㅎ

참조URL: https://stackoverflow.com/questions/47523082/cancelling-a-observable-with-takeuntil-not-working

반응형