1

So i have a table with a list of teams, what i want to do is when i click on a team name it displays a new view with team details. There is 2 controllers, 1 to get league table and fixtures and then 1 for the team details. So far i have from the controller in the league table looped through the Json object array and gotten a list of links which contains the ID i need to pass in to the team details controller so i can specify which team it should display. Because the teams dont have the ID in the object i had to do it this way.

So the problem is that i can console.log all ID's but it only passes through the last ID logged. Which genereates the same team what ever team i click on. I want to get the specific ID for the team i click on and pass that to the team details controller id:.

I'm in the learning stages so excuse my poor code :).
If you see any improvements in my code writing please do let me know.

I get my data from:
http://api.football-data.org/

using the AngularJs factory library from:
https://github.com/JohnnyTheTank/angular-footballdata-api-factory

The View

<tbody>
  <tr ng-repeat="team in teams.standing | filter:searchText | orderBy:orderByField:reverseSort">


    // Where i want to somehow click on a team name and load that teams details
    <td><a href="#!/teamDetails"><strong>{{ team.teamName }}</strong></a></td>
  </tr>
</tbody>

Controller1

.controller('AppCtrl', ['$scope', 'footballdataFactory',  function($scope, footballdataFactory) {
  $scope.date = new Date();
  var apiKey = '***********************';

  $scope.$back = function() {
    window.history.back();
  };

  $scope.leagueId = function(id) {
    $scope.id = id;

    footballdataFactory.getLeagueTableBySeason({
      id: $scope.id,
      apiKey: apiKey, // Register for a free api key: http://api.football-data.org/register
    }).success(function (data) {
      $scope.teams = data;
      $scope.leagueCaption = data.leagueCaption;

      console.log("Get League", $scope.teams);
      console.log('Loop through league and get team ids ----------------------------');
      $scope.getTeamId = function(teamId) {
        var dataLength = $scope.teams.standing.length;
        for(var tUrl = 0; tUrl < dataLength; tUrl++) {
          $scope.teamUrl = $scope.teams.standing[tUrl]._links.team.href.substr($scope.teams.standing[tUrl]._links.team.href.lastIndexOf('/') +1);
          console.log('teamId: ' + $scope.teamUrl);
        }
      }
    });
  };

  $scope.league = function(id) {
    $scope.id = id;
    footballdataFactory.getFixtures({
      league: $scope.id,
      apiKey: apiKey,
    }).success(function(data){
      $scope.games = data;
      console.log("getFixtures", $scope.games);
    });
  };
}])

Controller2

// Team details controller
.controller('TeamCtrl', ['$scope', 'footballdataFactory', function($scope, footballdataFactory) {
  var apiKey = '*************************';

  footballdataFactory.getTeam({
    id: $scope.teamUrl, ***Inserting the last 2 or 3 digits i get from the url***
    apiKey: apiKey,
  }).success(function(data){
    $scope.teams = data;
    $scope.name = data.name;
    $scope.crestUrl = data.crestUrl;
    $scope.squadMarketValue = data.squadMarketValue;
    console.log("getTeam", $scope.teams);
  });

  footballdataFactory.getPlayersByTeam({
    id: $scope.teamUrl,
    apiKey: apiKey,
  }).success(function(player){
    $scope.players = player.players;

    console.log("getPlayersByTeam", player);
  });
}])

1 Answer 1

0

You can solve this problem easly with apiNG and the football-data plugin, that based on the same angular lib you even use. on the plugin page is a link to a working plnkr sample

Sign up to request clarification or add additional context in comments.

1 Comment

Thank you, i will look in to it!

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.