我正在嘗試使用 angularjs 使用 api 并使用 ng-repeat 重復資料，但我在訪問物件的資料時遇到問題。
這是我得到的反饋。
(20) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {… }, {...}, {...}, {...}, {...}, {...}, {...}, {...}, {...}]
0：{名稱：'bulbasaur'，網址：'https://pokeapi.co/api/v2/pokemon/1/'}
1：{名稱：'ivysaur'，網址：'https://pokeapi.co/api/v2/pokemon/2/'}
2：{名稱：'venusaur'，網址：'https://pokeapi.co/api/v2/pokemon/3/'}
3：{名稱：'charmander'，網址：'https://pokeapi.co/api/v2/pokemon/4/'}
...和更多
$$hashKey：“物件：3”長度：20
<script>
angular.module('Pokedex', []).controller('myController', function ($scope, $http) {
$scope.pokemons = []
let getPokemons = function () {
$http.get('https://pokeapi.co/api/v2/pokemon/?offset={qtd')
.then(function (res) {
let pokemon = res.data.results
console.log(pokemon)
$scope.pokemons.push(pokemon)
})
}
getPokemons()
})
</script><body ng-controller="myController" ng-app="myapp">
<div>
<ul>
<li ng-repeat="pokemon in pokemons">
<h2>{{ pokemon.name }}</h2>
</li>
</ul>
</div>如果我做 pokemon[0].name，我只能訪問這個名字。我嘗試使用地圖，但無法訪問陣列資料，而且我對這個版本的 angular 不是很熟悉，我哪里出錯了？
uj5u.com熱心網友回復：
您應該將 api 中的回應陣列分配給$scope.pokemons.
如果您$scope.pokemons像現在一樣將 api 回應推送到陣列，您的完整回應將位于$scope.pokemons[0]location下，因此您無法ng-reeat在模板中回圈使用它。
作業小提琴
var app = angular.module('myApp', []);
app.controller('myCtrl', function ($scope, $http) {
$scope.pokemons = []
let getPokemons = function () {
$http.get('https://pokeapi.co/api/v2/pokemon/?offset={qtd')
.then(function (res) {
let pokemon = res.data.results
console.log(pokemon)
$scope.pokemons = pokemon;
})
}
getPokemons()
});<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
<div>
<ul>
<li ng-repeat="pokemon in pokemons">
<h2>{{ pokemon.name }}</h2>
</li>
</ul>
</div>
</div>uj5u.com熱心網友回復：
你需要ng-repeat在ng-repeat.
請參考：
<ul ng-repeat="pokemon in pokemons">
<li ng-repeat="(key, value) in pokemon">
<h2>{{ value.name }}</h2>
</li>
</ul>
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/366874.html
上一篇：如何剪輯影像以洗掉其填充