Question

我一直在使用这个api建立一个angular2应用程序：https://api.coinmarketcap.com/v1/ticker/

这个api返回一个字典数组（样本）：

[
{
    "id": "bitcoin",     <------ Wanna use this id
    "name": "Bitcoin", 
    "symbol": "BTC", 
    "rank": "1", 
    "price_usd": "9347.32", 
    "price_btc": "1.0", 
    "24h_volume_usd": "7926060000.0", 
    "market_cap_usd": "158936099373", 
    "available_supply": "17003387.0", 
    "total_supply": "17003387.0", 
    "max_supply": "21000000.0", 
    "percent_change_1h": "-0.24", 
    "percent_change_24h": "1.1", 
    "percent_change_7d": "6.62", 
    "last_updated": "1524926675"
},

我正在使用路由参数转到不同的页面：

<tr *ngFor="let curr of currency" [routerLink]="['/currdetail',curr.id]">    <------ Here 
      <th scope="row">{{ curr.rank }}</th>
      <td>{{curr.name}}</td>
      <td>{{curr.symbol}}</td>
      <td>{{curr.market_cap_usd}}</td>
      <td>{{curr.price_usd}}</td>
      <td>{{curr.price_btc}} </td>
      <td>{{curr.available_supply}} </td>
      <td>{{curr['24h_volume_usd']}} </td>
      <td>{{curr.percent_change_1h}} </td>
      <td>{{curr.percent_change_24h}}</td>
      <td>{{curr.percent_change_7d}} </td>
    </tr>

现在我已经编写了这样的路由并包含在我的路由模块中：

export const routes: Routes = [
    { path: 'table',  component: TableComponent },
    { path: 'currdetail/:id',     component: CurrdetailComponent },
    { path: '', redirectTo: '/table', pathMatch: 'full' },
];

Currdetail组件如下所示：

import { Component, OnInit } from '@angular/core';
import { CrypdataService } from '../crypdata.service'
import { Params, ActivatedRoute } from '@angular/router';
import { Location } from '@angular/common';

@Component({
  selector: 'app-currdetail',
  templateUrl: './currdetail.component.html',
  styleUrls: ['./currdetail.component.css'],
  providers: [CrypdataService],
})
export class CurrdetailComponent implements OnInit {

  private curr;

  constructor(private crypdataservice: CrypdataService, private route: ActivatedRoute, private location: Location) { }

  ngOnInit() {
  let id = +this.route.snapshot.params['id'];
  this.curr = this.crypdataservice.getcurr(id);
  }

  goBack(): void{
    this.location.back();
  }

}

这是crypdataservice文件：

import { Injectable } from '@angular/core';
import { Http, Response } from '@angular/http';
import 'rxjs/add/operator/map';

@Injectable()
export class CrypdataService {

  private baseUrl: string = 'https://api.coinmarketcap.com/v1/ticker/';

  constructor(private http: Http) { }

  getcurr(id : string){
      return this.http.get(`https://api.coinmarketcap.com/v1/ticker/`+id).map((res:Response) => res.json());
  }

  getall(){
      return this.http.get(`https://api.coinmarketcap.com/v1/ticker/`).map((res:Response) => res.json());
  }
}

它出现以下错误：

ERROR in src/app/currdetail/currdetail.component.ts(20,44): error TS2345: Argument of type 'number' is not assignable to parameter of type 'string'.

我从未将id指定为数字，因此无法弄清楚出了什么问题。谢谢你的阅读。

我想使用api获取特定货币的详细信息： https://api.coinmarketcap.com/v1/ticker/bitcoin/＆lt; ----这是id

Answer 1

删除+声明中的id：

let id = this.route.snapshot.params['id'];

这样当您致电getcurr(id)时，TypeScript认为id不是数字

一元加（+）（docs）

一元加运算符在其操作数和。之前计算其操作数但尝试将其转换为数字，如果它还没有。虽然一元否定（ - ）也可以转换非数字，一元加是最快和首选的转换方式成为一个数字的东西，因为它不执行任何其他对号码的操作。它可以转换字符串表示整数和浮点数，以及非字符串值true，false和空值。十进制和十六进制（“0x” - 前缀）格式的整数得到支持。支持负数（但不支持十六进制）。如果它无法解析特定值，它将评估为NaN。

类型'number'的参数不能分配给angular2中'string'类型的参数。

1 个答案: