AngularJS - 獲取JSON屬性並顯示它

-2

我有一個帶有ng-repeat的引導模型。它顯示JSON數據。現在我想單擊一個團隊（teamname）並將其顯示在console.log中。但是，我的問題是我不能得到teams.team（隊名）...AngularJS - 獲取JSON屬性並顯示它

你有任何想法如何處理這個？

app.js

app.controller('modalController', ['$scope', '$timeout', '$http', function ($scope, $timeout, $http) { 
    $scope.$on('modal', function (event, args) { 
     $http.get('../data/teams.json').then(function (response) { 
     var teams = response.data.teams; 
     var teamsArray = []; 
     for (var p in teams) { 
       var d = teams[p]; 
       teamsArray.push(d); 
     } 
     $scope.teamSelected = function() { 
       console.log("Clicked" + teams.team) 
     }; 
     $scope.teams = teamsArray; 
     }); 
    }) 
}]);

modal.html

<div class="col-md-4 col-sm-6 col-xs-12" ng-repeat="team in teams | filter:team | limitTo: paginationLimit()" ng-click="teamSelected(teams.team)"> 
    <div class="row pad-team-selection-view"> 
     <button type="button" class="btn btn-default team-selection-view"> 
      <img ng-src="{{ team.logo }}" width="18" height="18" class="img-logo">{{ team.team }} 
     </button> 
    </div> 
</div>

teams.json

{ 
    "teams": [ 
    { 
     "id": "0", 
     "league": "1. Bundesliga", 
     "team": "FC Augsburg", 
     "country": "Deutschland", 
     "logo": "https://upload.wikimedia.org/wikipedia/de/b/b5/Logo_FC_Augsburg.svg" 
    },

來源

2017-08-11 jglom

檢查我的回答恰好爲你工作。 –

很抱歉，但對方的回答是更詳細:( – jglom

@WilliamHampshire如果在計算器上一個公認的答案對你那麼重要，我會給你:) – jglom

在您傳遞給teams.team的ng-repeat div中，您實際上已經擁有團隊對象，因此您可以傳遞給團隊。此外，確保團隊的輸入您teamSelected功能是這樣的：

HTML：

ng-click="teamSelected(team)"

的JavaScript：

$scope.teamSelected = function (team) { 
    console.log("Clicked" + team.team) 
};

來源

2017-08-11 12:20:29

您在有錯誤ng-click參數

更換

<div class="col-md-4 col-sm-6 col-xs-12" ng-repeat="team in teams | filter:team | limitTo: paginationLimit()" ng-click="teamSelected(teams.team)"> 
    <div class="row pad-team-selection-view"> 
     <button type="button" class="btn btn-default team-selection-view"> 
      <img ng-src="{{ team.logo }}" width="18" height="18" class="img-logo">{{ team.team }} 
     </button> 
    </div> 
</div>

與

<div class="col-md-4 col-sm-6 col-xs-12" ng-repeat="team in teams | filter:team | limitTo: paginationLimit()" ng-click="teamSelected(team)"> 
    <div class="row pad-team-selection-view"> 
     <button type="button" class="btn btn-default team-selection-view"> 
      <img ng-src="{{ team.logo }}" width="18" height="18" class="img-logo">{{ team.team }} 
     </button> 
    </div> 
</div>

，你看，我們有ng-click="teamSelected(team)"和控制器

$scope.teamSelected = function() { 
    console.log("Clicked" + teams.team) 
};

與此代碼

替換此下面的代碼

$scope.teamSelected = function (obj) { 
    console.log("Clicked" + obj.team) 
};

來源

2017-08-11 12:19:21

你是我的英雄！ :) – jglom

AngularJS - 獲取JSON屬性並顯示它

回答

相關問題