快照参数/服务在 Angular 2 中返回 NaN

Question

我在使用 Angular2 中的路由器和激活路由将参数从一个组件传递到下一个组件时遇到问题

我的 EdmundsAPI 服务：

  getModels(makeNiceName: string): Observable<Models> {
    return this.http.get(this.baseURL +
      + makeNiceName + '/models?year=2017&view=basic' + this.apiKey)
      .map(res => res.json())
      .catch(this.handleError);
  }

我的 'from' 组件（品牌）：

  goToModels(makeNiceName: string): void {
    this.router.navigate ( [ '/models', { data: makeNiceName } ] );
  }

我的 'to' 组件（型号）：
（变量 'makeNiceName' 在 'export class' 声明之后）：

 makeNiceName: string = this.route.snapshot.params[ 'data' ];

  getModels(): void {
    this._EdmundsAPIService.getModels(this.makeNiceName)
      .subscribe(
        //Do Stuff here
        error =>  this.errorMessage = <any>error);
  }

我的 API URL 来自 Models.getModels() （来自 Chrome 浏览器检查 --> 网络）：

BaseURL + /NaN/ models?year=2017&view=basic + apiKey

为什么 NaN 代替了我的 'makeNiceName' 变量，这是一个字符串，我想将其传递给我的服务以生成 URL

Answer 1

你的函数getModels连续有两个加号，好像是把NaN插入到一个字符串中。

同样，当我计算 'string' + + 'hello' 时，结果是 "stringNaN"。但是当我尝试 'string' + + 123 结果是 "string123"

试试这个：

getModels(makeNiceName: string): Observable<Models> {
  return this.http.get(this.baseURL +
    makeNiceName + '/models?year=2017&view=basic' + this.apiKey)
    .map(res => res.json())
    .catch(this.handleError);
}

快照参数/服务在 Angular 2 中返回 NaN

Snapshot Parameter / Services returning NaN in Angular 2

javascript

angular

angular2-routing

nan

angular2-services