infer를 사용하여 박스형 Observable 값 가져 오기

dev_054

나는를 만든 pipe에 모든 소스를 변환하기 위해 Observable다음과 같이 :

// If T is like an Observable it infers the inner value, otherwise it returns T
type Unobservable<T> = T extends Observable<infer R> ? R : T;

@Pipe({
  name: 'toObservable'
})
export class ToObservablePipe implements PipeTransform {
  transform<T>(value: T): Observable<Unobservable<T>> {
    return isObservable(value) ? value : just(value);
  }
}

기능 자체는 작동하지만 반환 유형에 문제가 있습니다. 현재 다음 오류가 표시됩니다.

유형 '(T & Observable) | Observable '은'Observable> '유형에 할당 할 수 없습니다. 'T & Observable'유형은 'Observable>'유형에 할당 할 수 없습니다. 'unknown'유형은 'Unobservable'유형에 할당 할 수 없습니다.

컨텍스트를 위해 파이프의 사용은 다음과 같을 수 있습니다.

<h4>Array source</h4>

<pre>{{ array | toObservable | async | json }}</pre>

컴파일러를 "행복하게"만들려면 어떻게해야합니까? :)

데모

개발자 033

대신 @ angular / AsyncPipe 로 오버로드를 사용할 수 있습니다 .

import { Pipe, PipeTransform } from '@angular/core';
import { isObservable, Observable, of as just } from 'rxjs';

@Pipe({
  name: 'toObservable'
})
export class ToObservablePipe implements PipeTransform {
  transform<T>(value: null): null;
  transform<T>(value: undefined): undefined;
  transform<T>(value: Observable<T> | null | undefined): Observable<T> | null | undefined;
  transform<T>(value: T): Observable<T> | null | undefined;
  transform(value: Observable<any> | null | undefined): any {
    // can be also if (value === null || value === undefined) ...
    if (value == null) return value;

    return isObservable(value) ? value : just(value);
  }
}

WORKING DEMO


일부 테스트 사례 :

const obj = { label: 1 };

// Error!
new ToObservablePipe().transform(null).subscribe(response => console.log(response));

// Error!
new ToObservablePipe().transform(undefined).subscribe(response => console.log(response));

// Inferred as string
new ToObservablePipe().transform('').subscribe(response => console.log(response));

// Inferred as number
new ToObservablePipe().transform(0).subscribe(response => console.log(response));

// Inferred as { label: number }
new ToObservablePipe().transform(just(obj)).subscribe(response => console.log(response));

// Inferred as { label: number }[]
new ToObservablePipe().transform([obj]).subscribe(response => console.log(response));

// Inferred as { label: number }
new ToObservablePipe().transform(obj).subscribe(response => console.log(response));

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

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

에서 수정
0

몇 마디 만하겠습니다

0리뷰
로그인참여 후 검토

관련 기사

분류에서Dev

jquery를 사용하여 배열의 체크 박스 값 가져 오기

분류에서Dev

선형 회귀를 사용하여 예측 값 가져 오기

분류에서Dev

css ()를 사용하여 스타일 속성 값 가져 오기

분류에서Dev

method = "post"를 사용하여 이메일에서 체크 박스 값 가져 오기

분류에서Dev

PHP를 사용하여 콤보 박스에서 선택한 전체 값 가져 오기

분류에서Dev

Spring Boot를 사용하여 체크 박스 목록에서 컨트롤러로 선택한 값 가져 오기

분류에서Dev

Jquery를 사용하여 텍스트 영역의 기본값 가져 오기

분류에서Dev

"시작"선택기를 사용하여 클래스 이름 값 가져 오기

분류에서Dev

HierarchyId를 사용하여 C # 익명 형식에서 값 가져 오기

분류에서Dev

Livewire를 사용하여 URL에서 유형 매개 변수 값 가져 오기

분류에서Dev

Excel VBA를 사용하여 클래스 속성 값 가져 오기

분류에서Dev

자바 스크립트를 사용하여 자식 요소 값 가져 오기

분류에서Dev

CosmosDB CosmosClient를 사용하여 C #에서 스칼라 값 가져 오기

분류에서Dev

lapply를 사용하여 목록의 최소값 인덱스 가져 오기

분류에서Dev

Javascript를 사용하여 일반 텍스트 API에서 값 가져 오기

분류에서Dev

jquery on () 함수 및 순회를 사용하여 값 / 텍스트 가져 오기

분류에서Dev

Jquery를 사용하여 MVC 텍스트 상자 값 가져 오기

분류에서Dev

DOMXPath를 사용하여 특정 텍스트 노드의 값 가져 오기

분류에서Dev

인덱스 번호를 사용하여 PHP 배열에서 값 가져 오기

분류에서Dev

Javasctipt를 사용하여 HTML 텍스트 필드 값 가져 오기

분류에서Dev

XPath를 사용하여 속성 가져 오기 및 값 속성을 사용하여 내부 텍스트 제공

분류에서Dev

Javascript를 사용하여 태그 값의 내용 가져 오기

분류에서Dev

Union을 사용할 때 DefaultIfEmpty를 사용하여 기본 클래스 값 가져 오기

분류에서Dev

XPath를 사용하여 임계 값보다 큰 스타일 값을 가진 요소 가져 오기

분류에서Dev

jpath를 사용하여 Json에서 값 가져 오기

분류에서Dev

Python ElementTree를 사용하여 XML에서 값 가져 오기

분류에서Dev

xmllint를 사용하여 XML에서 노드 값 가져 오기

분류에서Dev

변수를 사용하여 배열 속성 값 가져 오기

분류에서Dev

JQuery / Ajax를 사용하여 세션 값 가져 오기

Related 관련 기사

  1. 1

    jquery를 사용하여 배열의 체크 박스 값 가져 오기

  2. 2

    선형 회귀를 사용하여 예측 값 가져 오기

  3. 3

    css ()를 사용하여 스타일 속성 값 가져 오기

  4. 4

    method = "post"를 사용하여 이메일에서 체크 박스 값 가져 오기

  5. 5

    PHP를 사용하여 콤보 박스에서 선택한 전체 값 가져 오기

  6. 6

    Spring Boot를 사용하여 체크 박스 목록에서 컨트롤러로 선택한 값 가져 오기

  7. 7

    Jquery를 사용하여 텍스트 영역의 기본값 가져 오기

  8. 8

    "시작"선택기를 사용하여 클래스 이름 값 가져 오기

  9. 9

    HierarchyId를 사용하여 C # 익명 형식에서 값 가져 오기

  10. 10

    Livewire를 사용하여 URL에서 유형 매개 변수 값 가져 오기

  11. 11

    Excel VBA를 사용하여 클래스 속성 값 가져 오기

  12. 12

    자바 스크립트를 사용하여 자식 요소 값 가져 오기

  13. 13

    CosmosDB CosmosClient를 사용하여 C #에서 스칼라 값 가져 오기

  14. 14

    lapply를 사용하여 목록의 최소값 인덱스 가져 오기

  15. 15

    Javascript를 사용하여 일반 텍스트 API에서 값 가져 오기

  16. 16

    jquery on () 함수 및 순회를 사용하여 값 / 텍스트 가져 오기

  17. 17

    Jquery를 사용하여 MVC 텍스트 상자 값 가져 오기

  18. 18

    DOMXPath를 사용하여 특정 텍스트 노드의 값 가져 오기

  19. 19

    인덱스 번호를 사용하여 PHP 배열에서 값 가져 오기

  20. 20

    Javasctipt를 사용하여 HTML 텍스트 필드 값 가져 오기

  21. 21

    XPath를 사용하여 속성 가져 오기 및 값 속성을 사용하여 내부 텍스트 제공

  22. 22

    Javascript를 사용하여 태그 값의 내용 가져 오기

  23. 23

    Union을 사용할 때 DefaultIfEmpty를 사용하여 기본 클래스 값 가져 오기

  24. 24

    XPath를 사용하여 임계 값보다 큰 스타일 값을 가진 요소 가져 오기

  25. 25

    jpath를 사용하여 Json에서 값 가져 오기

  26. 26

    Python ElementTree를 사용하여 XML에서 값 가져 오기

  27. 27

    xmllint를 사용하여 XML에서 노드 값 가져 오기

  28. 28

    변수를 사용하여 배열 속성 값 가져 오기

  29. 29

    JQuery / Ajax를 사용하여 세션 값 가져 오기

뜨겁다태그

보관