AngularJS - получить атрибут JSON и отобразить его

Question

У меня есть модель начальной загрузки с ng-repeat. Он отображает данные JSON. Теперь я хочу нажать на команду (название команды) и отобразить ее в console.log . Но моя проблема в том, что я не могу получить teams.team (название команды)...

У вас есть идеи, как с этим справиться?

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"
    },

Answer 1

В ng-repeat div, где вы проходите в teams.team, у вас уже есть командный объект, поэтому вы можете просто передать его в команду. Также убедитесь, что команда является входом для вашей команды teamSelected следующим образом:

HTML:

ng-click="teamSelected(team)"

JavaScript:

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

Answer 2

У вас есть ошибка в 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)
};