Presenting answers dynamically from a large API using angular js (fetch)

Question

My goal is to create a function to shows hearthstone cards from the game. My API is working and I am fetching the data from the API, no problem here. The problem I run into is to show the result in my HTML page.

I've tried different object calls within the angular tag {{ }}, but the closest I've gotten is giving me the result of [[Object Object]].

Right now I am working on getting the API and HTML page to work correctly, so everything is in sync, so I am not looking for a full solution on a search engine through the data, just so that it syncs with my HTML page and shows the data I am calling (specific hardcoded data location).

This is all the code inside the controller:

var produkterControllers = angular.module('produkterControllers', []);

produkterControllers.controller('minApiFunktionController', function myController($scope, $http, $q) {
    var fetchPromise = fetch("https://omgvamp-hearthstone-v1.p.rapidapi.com/cards", {
            "method": "GET",
            "headers": {
                "x-rapidapi-host": "omgvamp-hearthstone-v1.p.rapidapi.com",
                "x-rapidapi-key": "8ad5a16c67mshed80ba15c31ab54p141ec5jsnfbff6480fd40"
            }
        })

    var angularPromise = $q.when(fetchPromise);

        angularPromise.then(function (response) {
            var test = response.json;
            return response.json();
        }).then(function (data) {
            console.log('this is the data, ', data);
            $scope.cards = data;
        });   
});

This is the code inside index.html that's supposed to show the result (relevant to quesiton)

<div ng-controller="minApiFunktionController">
    <ul>
        <li ng-repeat="item in cards">
            <p> 
                <span>{{item.Basic.cardId}}</span>
            </p>
        </li>
    </ul>
</div>

Just to clarify I got the controller imported and the index.html is including the module, show this code to clarify that the controller is connected to my index.html page.

<html ng-app="produkterControllers">

Answer 1

也许 $scope.cards 不是数组，并且不会在 ng-repeat 中显示

Presenting answers dynamically from a large API using angular js (fetch)

Question

1 answers

solution1
0 2019-12-03 06:23:37

Presenting answers dynamically from a large API using angular js (fetch)

Question

1 answers

solution1 0 2019-12-03 06:23:37

solution1
0 2019-12-03 06:23:37