Question

我开始学习Angular 4，我认为bungie.net API是一个很好的操场。

我在这里要做的是：当用户输入他们的显示名称（gamertag或psn id）时，他们会获得统计数据的页内仪表板。

我可以通过让他们把他们的“membershipId”来实现这一点，但显然没有人知道这一点，你需要去找bungie.net sie找到你的，而你总是知道你的显示名称。

他们的API有一个端点来返回会员ID：

https://www.bungie.net/platform/Destiny/Help/HelpDetail/GET?uri=%7bmembershipType%7d%2fStats%2fGetMembershipIdByDisplayName%2f%7bdisplayName%7d%2f

问题是我不知道如何使用返回的成员资格ID然后通过此端点获得统计信息的响应，该端点仅支持membershipInd而不支持显示名称。（https://www.bungie.net/platform/destiny/help/HelpDetail/GET?uri=Stats%2fAccount%2f%7bmembershipType%7d%2f%7bdestinyMembershipId%7d%2f）

以下是我现在使用的一些示例代码（有些是硬编码的，因为我无法实现以下目标）。

服务：

import { Injectable } from '@angular/core';
import { environment } from '../../environments/environment';
import { Http, Response, RequestOptions, Headers } from '@angular/http';
import 'rxjs/add/operator/map';



@Injectable()
export class bungieService {
  private query: string;
  private API_URL_PLAYER_ID: string = environment.BUNGIE_API_URL_PLAYER_ID;
  private URL_PLAYER_ID: string = this.API_URL_PLAYER_ID + '';
  private API_URL_PLAYER_STATS: string = environment.BUNGIE_API_URL_PLAYER_STATS;
  private URL_PLAYER_STATS: string = this.API_URL_PLAYER_STATS;


  constructor (private _http: Http) {}


    getPlayerId(query) {
        let headers: Headers = new Headers();
        var apiKey = "786eefe6a85b4bac9858f71dd4006dc9";
        headers.append("X-API-Key", apiKey);
        let opts: RequestOptions = new RequestOptions();
        opts.headers = headers;
        return this._http.get(this.URL_PLAYER_STATS + '4611686018430120182/' , opts).map(res=> res.json());
    }


}

组件ts（与vanilla略有不同，但searchPlayer功能相同）

    import { Component, OnInit } from '@angular/core';
import { bungieService } from '../shared/bungie.service';
import { Http, Response, RequestOptions, Headers } from '@angular/http';

@Component({
  selector: 'app-nexus',
  templateUrl: './nexus.component.html',
  styleUrls: ['./nexus.component.css']
})
export class NexusComponent implements OnInit {
    playerId: any[];
    playerIdFound: boolean = false;
    playerSummary: any[];
    playerSummaryFound: boolean = false;

        handleSuccessPlayerId(data) {
        this.playerIdFound = true;
        this.playerId = data;
        console.log(data.Response);
    }

                handleSuccessPlayerChar(data) {
        this.playerSummaryFound = true;
        this.playerSummary = data;
        console.log(data.Response.data.characters);
    }


  constructor(private _bungieService: bungieService) { }

    searchPlayer (query: string) {
    return this._bungieService.getPlayerId(query).subscribe(
        data => this.handleSuccessPlayerId(data),
        error => console.log(error),
        () => console.log("complete!!!!")
        )
  }

      searchPlayersChar (query: string) {
    return this._bungieService.getPlayerSummary(query).subscribe(
        data => this.handleSuccessPlayerChar(data.Response.data.characters),
        error => console.log(error),
        () => console.log("complete!!!!")
        )
  }



  ngOnInit() {
  }

}

组件html：

 <div class="container">

<div class="well"  style="margin-top:5rem;">
    <input class="search" [(ngModel)]="searchQueryPlayer" placeholder="search for data">
    <button (click)="searchPlayers(searchQueryPlayer)" type="button">Find data</button>
    <span>{{ players.Response.data.membershipType }}</span> 
</div>

环境：

export const environment = {
  production: false,
  BUNGIE_API_KEY: 'myApiKey',
  BUNGIE_API_URL_PLAYER_ID: 'https://www.bungie.net/Platform/Destiny/2/Stats/GetMembershipIdByDisplayName/',
  BUNGIE_API_URL_PLAYER_STATS: 'https://www.bungie.net/Platform/Destiny/Stats/Account/2/',
};

获取API响应并在另一个调用中同时使用它（有角度的）

0 个答案: