标签: pokeapi

抱歉这个菜鸟问题。我创建了一个 http 请求并检索了一些 pokemon 数据并将其放入名为 pokemon 的对象中，如下所示：

export class AppComponent implements OnInit{
  title = 'Pokedex';
  apiURL = 'https://pokeapi.co/api/v2/pokemon/1';
  pokemon = {};
  constructor(private http: HttpClient){}

  ngOnInit(): void{
    this.http.get(this.apiURL).subscribe(data =>{
        const pokemon = {
          name: data['name'],
          id: data['id'],
          abilities: data['abilities'].map( ability => ability['ability']['name']),
          types: data['types'].map( type => type['type']['name']),
          image: data['sprites']['front_default']
      }
      console.log(pokemon);

当我控制台记录该对象时，它会在控制台中正常输出。但是，当我尝试在 html 中显示它时，{{ pokemon }}它只返回 [object, Object]

我该如何解决这个问题？

我已经尝试过下面建议的方法。{{pokemon.name}}、{{pokemon[name]}} 和 {{pokemon?.name} 显示空白页面。

{{ 口袋妖怪 | json }}

我也许做错了什么吗？

我遇到一个问题，我似乎无法在我的 React 前端显示神奇宝贝图像，这是 api： https: //pokeapi.co/

import React, { Component } from 'react';

class Card extends Component {
    state = {
        name: "",
        imageUrl: "",
        pokemonIndex: "",
    }
    componentDidMount() {
        const {name, url} = this.props;
        const pokemonIndex = url.split('/')[url.split('/').length - 2];
        const imageUrl = `http://pokeapi.co/media/sprites/pokemon/${pokemonIndex}.png`
        this.setState({name, imageUrl, pokemonIndex})
    }
    render() {
        
       
        
        return (
            <div className="card" >
                <img src= {this.state.imageUrl}/>
                <h3> {this.state.name} </h3>
                
            </div>
        );
    }
}

export default Card;

我还附上了前端的屏幕截图。

这是我的代码：

import pokebase as pb #pip install pokebase
p1 = pb.pokemon('venusaur')
types = ''
for poketype in p1.types:
    types += poketype.type.name.capitalize()+', '
print(types)

它打印这样的数据：

Grass, Poison, 

所以这里的问题是它在最后打印一个逗号也是错误的。我尝试使用结束和分隔符参数删除它，但它不起作用。我怎样才能删除最后的逗号？