0

自分のHttp呼び出しをAuthHttp呼び出しに変換しようとしていますが、AuthHttpを使用するときにコンパイルエラーが表示されます。私はこれを解決するために2回の試みを行い、両方とも異なるエラーを生じました。サブスクリプションをコンポーネントから取得し、そのサービスが観測可能な状態に戻すようにする構造を保持したいと思います。サービスと観測可能なAuthHttpを使った角2 +/Auth0

サブスクライブするコンポーネント。両方のトレールで同じです。

import { Component, OnInit } from '@angular/core'; 

import { Hero } from '../hero'; 

import { HeroService } from '../hero.service'; 

@Component({ 
    selector: 'app-dashboard', 
    templateUrl: './dashboard.component.html', 
    styleUrls: [ './dashboard.component.css' ] 
}) 
export class DashboardComponent implements OnInit { 
    heroes: Hero[] = []; 

    constructor(private heroService: HeroService) { } 

    ngOnInit() { 
    this.getHeroes(); 
    } 

    getHeroes(): void { 
    this.heroService.getHeroes() 
     .subscribe(heroes => this.heroes = heroes.slice(1, 5)); 
    } 
} 

サービス、非関連コードは(同じ問題を持っているが、私は私は1つで助けを得ることができれば、私は他のCRUD機能を把握することができます理解他の機能)を欠落していると私はuncomentedそれらの両方を置くが、私は1つコメントします。

import { Injectable } from '@angular/core'; 
import { Hero } from './hero'; 
import { Observable } from 'rxjs/Observable'; 
import { of } from 'rxjs/observable/of'; 
import { MessageService } from './message.service'; 
// import { HttpClient, HttpHeaders } from '@angular/common/http'; 
import { AuthHttp } from 'angular2-jwt'; 
import { catchError, map, tap } from 'rxjs/operators'; 

@Injectable() 
export class HeroService { 

    ... 

    /** GET heroes from the server */ 
    getHeroes(): Observable<Hero[]> { 
    // Trial 1 
    return this.authHttp.get<Hero[]>(this.heroesUrl).pipe(
     tap(heroes => this.log(`fetched heroes, ${this.heroesUrl}`)), 
     catchError(this.handleError('getHeroes', [])) 
    ); 

    // Trial 2 
    return this.authHttp 
     .get(this.heroesUrl) 
     .map((res: Response) => <Hero[]>res.json()); 
    } 

    ... 

    constructor(
    // private http: HttpClient, 
    private authHttp: AuthHttp, 
    private messageService: MessageService) { } 
} 

エラーが、私は私が間違っているのかわからないのです

// Trial 1 
ERROR in src/app/hero.service.ts(36,12): error TS2558: Expected 0 type arguments, but got 1. 

// Trial 2 
    Property 'includes' is missing in type 'Promise<any>'. 
ERROR in src/app/hero.service.ts(44,12): error TS2345: Argument of type '(res: Response) => Hero[]' is not assignable to parameter of type '(value: Response, index: number) => Hero[]'. 
    Types of parameters 'res' and 'value' are incompatible. 
    Type 'Response' is not assignable to type 'Response'. Two different types with this name exist, but they are unrelated. 
src/app/hero.service.ts(44,31): error TS2352: Type 'Promise<any>' cannot be converted to type 'Hero[]'. 
src/app/hero.service.ts(44,31): error TS2352: Type 'Promise<any>' cannot be converted to type 'Hero[]'. 
    Property 'includes' is missing in type 'Promise<any>'. 

を受け、どのような援助が認められます。

もう1つの質問は、AuthHttpでhttpオプションを渡す必要がある場合です。ここでの例では、サービスから

const httpOptions = { 
    headers: new HttpHeaders({ 'Content-Type': 'application/json' }) 
    }; 

    /** PUT: update the hero on the server */ 
    updateHero (hero: Hero): Observable<any> { 
    const url = `${this.heroesUrl}/${hero.id}`; 
    return this.http.put(url, hero, httpOptions).pipe(
     tap(_ => this.log(`updated hero id=${hero.id}, ${url}`)), 
     catchError(this.handleError<any>('updateHero')) 
    ); 
    } 

である私はここで、HTTPを使用しますが、authHttpでそれを交換し、私はもうhttpOptionsが必要な場合はわからないだろうか?

ありがとうございます。

答えて

関連する問題