4/7 getting only this response {{ info.home_team }}


#1

app.directive("game", function(){
  return {
    restrict: 'E',
    scope: { info: '=' },
    templateUrl: "js/directives/game.html"
  };
});

<div class="col-sm-4">
  <div class="row scorecard">
    <p class="period"> </p>
    <div class="visitor col-xs-4">
      <h2 class="visitor-score">{{ info.visitor_score }} </h2>
      <h3>
        <span class="visitor-team.city"> {{ info.visitor_team.city }}</span><br/>
        <span class="visitor-team.name"> {{ info.visitor_team.name }} </span>
      </h3>
    </div>
    <div class="dash col-xs-3">
      <h2>-</h2>
    </div>
    <div class="home col-xs-4">
      <h2 class="home-score"> {{ info.home_score }}</h2>
      <h3>
        <span class="home-team.city">{{ info.home_team.city }}</span><br/>
        <span class="home-team.name"> {{ info.home_team.name }}</span>
      </h3>
    </div>
  </div>
</div>

    <div class="main" ng-controller = "GameboardApp">
      <div class="container">
        
        <div info="scores" ng-repeat = "score in scores">
          
					<game>{{ info.home_team }}</game>
          
        </div>
      
      </div>
    </div>

#2

We cannot see any of the load sequence. Please show your complete index.html code. Thanks.


#3

Please let me know if I left anything out. Thanks for your help.

app.controller('ScoreController', ['$scope', function($scope) {

$scope.scores = [

{

  datetime: 1420848000000,

  visitor_team: {

    city: "Charlotte",

    name: "Hornets"

  },

  home_team: {

    city: "New York",

    name: "Knicks"

  },

  period: "Final",

  visitor_score: 110,

  home_score: 82

},

{

  datetime: 1420848000000,

  visitor_team: {

    city: "Dallas",

    name: "Mavericks"

  },

  home_team: {

    city: "Los Angeles",

    name: "Clippers"

  },

  period: "Final",

  visitor_score: 100,

  home_score: 120

},

{

  datetime: 1420848000000,

  visitor_team: {

    city: "Brooklyn",

    name: "Nets"

  },

  home_team: {

    city: "Detroit",

    name: "Pistons"

  },

  period: "Third Quarter",

  visitor_score: 69,

  home_score: 74

},

{

  datetime: 1420848000000,

  visitor_team: {

    city: "Indiana",

    name: "Pacers"

  },

  home_team: {

    city: "Philadelphia",

    name: "76ers"

  },

  period: "Third Quarter",

  visitor_score: 70,

  home_score: 72

},

{

  datetime: 1420848000000,

  visitor_team: {

    city: "San Antonio",

    name: "Spurs"

  },

  home_team: {

    city: "Minnesota",

    name: "Timberwolves"

  },

  period: "Halftime",

  visitor_score: 58,

  home_score: 43

},

{

  datetime: 1420848000000,

  visitor_team: {

    city: "Orlando",

    name: "Magic"

  },

  home_team: {

    city: "Portland",

    name: "Trail Blazers"

  },

  period: "First Quarter",

  visitor_score: 13,

  home_score: 26

}

];

}]);

<p class="period"> {{ info.period }}</p>

<div class="visitor col-xs-4">

  <h2 class="visitor-score">{{ info.visitor_score }} </h2>

  <h3>

    <span class="visitor-team.city"> {{ info.visitor_team.city }}</span><br/>

    <span class="visitor-team.name"> {{ info.visitor_team.name }} </span>

  </h3>

</div>

<div class="dash col-xs-3">

  <h2>-</h2>

</div>

<div class="home col-xs-4">

  <h2 class="home-score"> {{ info.home_score }}</h2>

  <h3>

    <span class="home-team.city">{{ info.home_team.city }}</span><br/>

    <span class="home-team.name"> {{ info.home_team.name }}</span>

  </h3>

</div>

app.directive("game", function(){

return {

restrict: 'E',

scope: { info: '=' },

templateUrl: "js/directives/game.html"

};

});

<link href='https://fonts.googleapis.com/css?family=Roboto:400,100,300' rel='stylesheet' type='text/css'>

<link href='https://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>

<link href="https://s3.amazonaws.com/codecademy-content/projects/bootstrap.min.css" rel="stylesheet">

<link href="css/main.css" rel="stylesheet">



<script src="js/vendor/angular.min.js"></script>

<div class="header">

  <h1 class="logo">GameBoard</h1>

</div>


<div class="main" ng-controller = "ScoreController">

  <div class="container">

    

    <game info="scores" ng-repeat = "score in scores">

     {{ info.period }}

    </game>

  

  </div>

</div>



<!-- Modules -->

<script src="js/app.js"></script>


<!-- Controllers -->

<script src="js/controllers/ScoreController.js"></script>


<!-- Directives -->



                            <script src="js/directives/game.js"></script>


#4

The only thing we don't see is the attachment of the app to the body tag, but I'm going to assume it has been done.

I notice a prevelance for using white space in attributes. HTML markup convention generally foregoes white space in favor of tightness.

<game info="scores" ng-repeat="score in scores">

This may not have any bearing on the problem, but is worth noting. As near as I can tell, your code checks out, otherwise.


#6

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.