Question

我在控制台中收到以下错误：

webpack：正在编译... 10％构建模块0/1模块1处于活动状态   ... p / shoppinglist2 / src / app / app.module.tsERROR in   src / app / meal.service.ts（46,56）：错误TS1109：预期的表达。

日期：2017-12-31T09：55：50.224Z
  哈希：8003d6d8f334085afa7f时间：267ms chunk {inline} inline.bundle.js   （内联）5.79 kB [entry] chunk {main} main.bundle.js（main）73.1 kB   [initial] [rendered] chunk {polyfills} polyfills.bundle.js（polyfills）   558 kB [initial] chunk {styles} styles.bundle.js（styles）456 kB   [initial] chunk {vendor} vendor.bundle.js（vendor）11.3 MB [initial]

webpack：已成功编译。

我没有看到问题所在。该代码基于https://angular.io/tutorial/toh-pt6中的Angular HTTP示例。我使用Angular ^ 5.0.0，rxjs ^ 5.5.2

来自meal.service.ts的代码：

import { Injectable }              from '@angular/core';
import { Observable }              from 'rxjs/Observable';
import { catchError, map, tap }    from 'rxjs/operators';
import { of }                      from 'rxjs/observable/of';
import { HttpClient, HttpHeaders,
         HttpParams }              from '@angular/common/http';

import { MessageService }          from './message.service';
import { Meal, oneMeal, Meals }    from './meal';

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

@Injectable()
export class MealService {

  constructor(
    private http: HttpClient,
    private messageService: MessageService
  ) { };

  private mealUrl = 'http://192.168.178.11:1337/api/meal';

  private log(message: string) {
    this.messageService.add('MealService: ' + message);
  };

  private handleError<T> (operation = 'operation', result?: T) {
    return (error: any): Observable<T> => {
      console.error(error)
      this.log(`${operation} failed: ${error.message}`);
      return of(result as T);
    };
  }

  getMeals (page:number): Observable<Meals> {
    let httpParams = new HttpParams().set('where', '%')
      .set('orderBy', 'meal_id')
      .set('page', page.toString())
      .set('items', '10');
    //this.messageService.add('Debug: ' + httpParams);
    return this.http.get<Meals>(this.mealUrl, { params: httpParams  })
      .pipe(
        tap(meals => this.log(`fetched ${meals.count} entries`)),
        catchError(this.handleError('getMeals', <Meals>)) // Line 46: the Error
      );
  };

  getMeal (id:number): Observable<oneMeal> {
    let httpParams = new HttpParams().set('id', id.toString());
    //this.messageService.add(`MealService: fetched meal_id=${id}`);
    return this.http.get<oneMeal>(this.mealUrl, { params: httpParams })
      .pipe(
        tap(meal => this.log(`fetched ${meal.data[0].meal_name}`))//,
        //catchError(this.handleError('getMeal', <oneMeal>))
      );
  }
}

Answer 1

您正在以错误的方式调用泛型方法以便您得到这个 -

src / app / meal.service.ts（46,56）中的错误：错误TS1109：表达式预期

错误的方式

catchError(this.handleError('getMeals', <Meals>)) // Line 46: the Error

正确的方式

catchError(this.handleError<Meals>('getMeals'))

 getMeals (page:number): Observable<Meals> {
    let httpParams = new HttpParams().set('where', '%')
      .set('orderBy', 'meal_id')
      .set('page', page.toString())
      .set('items', '10');
    //this.messageService.add('Debug: ' + httpParams);
    return this.http.get<Meals>(this.mealUrl, { params: httpParams  })
      .pipe(
        tap(meals => this.log(`fetched ${meals.count} entries`)),
        catchError(this.handleError<Meals>('getMeals')) // Line 46: the Error
      );
  };

Answer 2

如果你在你提到的文档中检查handleError函数，你会注意到它希望收到一个参数，

private handleError<T> (operation = 'operation', result?: T) {
return (error: any): Observable<T> => {

  // TODO: send the error to remote logging infrastructure
  console.error(error); // log to console instead

  // TODO: better job of transforming error for user consumption
  this.log(`${operation} failed: ${error.message}`);

  // Let the app keep running by returning an empty result.
  return of(result as T);
 };
}

但是在你的代码中，你使用的是handleError函数错误。

getMeals (page:number): Observable<Meals> {
    let httpParams = new HttpParams().set('where', '%')
      .set('orderBy', 'meal_id')
      .set('page', page.toString())
      .set('items', '10');
    //this.messageService.add('Debug: ' + httpParams);
    return this.http.get<Meals>(this.mealUrl, { params: httpParams  })
      .pipe(
        tap(meals => this.log(`fetched ${meals.count} entries`)),
        catchError(this.handleError('getMeals', <Meals>)) // Line 46: the Error
      );
  };

这就是为什么你得到这个 - 在src / app / meal.service.ts（46,56）中的错误：错误TS1109：预期的表达。 试试这个 -

catchError（this.handleError＆lt; Meals＆gt;（＆＃39; getMeals＆＃39;））

希望有所帮助。

角度TS错误TS1109

2 个答案: