source

일반 유형 '관찰 가능'에는 1개의 유형 인수가 필요합니다.

lovecheck 2023. 6. 26. 21:27
반응형

일반 유형 '관찰 가능'에는 1개의 유형 인수가 필요합니다.

아래의 Angular 2 (TypeScript) 코드는 나에게 3 이하의 오류, 그것들을 해결하는 방법을 주었습니다.제안해 주세요.

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { NgModule, Component } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { HttpModule, Http } from '@angular/http';
import 'rxjs/add/operator/map';
import { Observable } from "rxjs/Observable";

@Component({
    selector: 'http-client',
    template: `<h1>All Products</h1>
  <ul>
    <li *ngFor="let product of products">
       {{product.title}}
    </li>
  </ul>
  `})
class AppComponent {

    products: Array<string> = [];

    theDataSource: Observable;

    constructor(private http: Http) {

        this.theDataSource = this.http.get('api/products/')
            .map(res => res.json());
    }

    ngOnInit() {
        // Get the data from the server
        this.theDataSource.subscribe(
            data => {
                if (Array.isArray(data)) {
                    this.products = data;
                } else {
                    this.products.push(data);
                }
            },
            err =>
                console.log("Can't get products. Error code: %s, URL: %s ", err.status, err.url),
            () => console.log('Product(s) are retrieved')
        );
    }
}

@NgModule({
    imports: [BrowserModule,
        HttpModule],
    declarations: [AppComponent],
    bootstrap: [AppComponent]
})
class AppModule { }

platformBrowserDynamic().bootstrapModule(AppModule);

오류는,

  1. TS2314 일반 유형 '관찰 가능'에는 1개의 형식 인수가 필요합니다.
  2. TS7006 매개 변수 'data'에 암시적으로 'any' 유형이 있습니다.
  3. TS7006 매개 변수 'err'에 암시적으로 'any' 유형이 있습니다.
theDataSource: Observable<any>;

어디에any방출해야 하는 값의 유형과 일치하는 보다 구체적인 유형일 수 있습니다(가능한 경우).

Angular Http 모듈의 소스를 보면 Http 클래스의 메서드 요청을 찾을 수 있습니다.

https://github.com/angular/angular/blob/2.4.1/modules/%40angular/http/src/http.ts#L111

다른 모든 메서드(get, post 등)는 이 요청을 래핑합니다.또한 요청이 일반적인 응답 클래스를 가진 관찰 가능한 항목을 반환하는 것을 볼 수 있습니다.응답 클래스는 Http 모듈의 일부이므로 코드를 다음으로 수정할 수 있습니다.

import { HttpModule, Http, Response } from '@angular/http';
...
theDataSource: Observable<Response>;

또는 이 강력한 유형화가 필요하지 않은 경우 일반 매개 변수로 전달할 수 있습니다.

theDataSource: Observable<any>;

하지만 제 생각에는 강력한 유형화가 더 나은 선택입니다.

1)theDataSource: Observable;->theDataSource: Observable<any>;

2/3) 추가 가능"noImplicitAny": false당신에게tsconfig.json

또는 변경data =>그리고.err =>와 함께(data: any) =>그리고.(err: any) =>

여기서 할 수 있는 최선의 방법은 다음과 같이 설정하는 것입니다.theDataSource: Observable<Response>;왜냐하면 그것은 사실 건설자에서 당신의 작업에 기초한 유형이기 때문입니다.피하겠어요any역병처럼

참고로, 여기서 당신의 재산에 도움이 되지 않는다는 것을 알지만, 방법으로 이것을 하려고 할 때 당신은 할 수 있습니다.

  type MethodPayload<T> = {
    something: string;
    data: T;
  }

  methodName<T>(payload: MethodPayload<T>) {
    // thing with payload
  }

명령으로 문제 해결: npm install @types/google maps@3.39.12 --save-dev

혹시 누락된 앵글 브라켓 때문일 수도 있나요?

Observable(PhotosResult)대신에Observable<PhotosResult>

언급URL : https://stackoverflow.com/questions/41757684/generic-type-observablet-requires-1-type-argument

반응형