How To Dynamically Set Zingchart Attribute Within Angular Ng-repeat

Using AngularJS, I'm trying to build a page which features a different dynamically generated Zingchart for each object in an array. My problem is that -- as the data and variable n

Solution 1:

Instead of creating the json objects directly on $scope you can try do add them on a separate property:

$scope.nfLines = {};

functiongetWeeklyNflLines(){
  oddsService.getWeeklyNflLines($stateParams.weekNumb).then(function(games){
    vm.nflLines = games;
    for (i=0; i<vm.nflLines.length; i++){
      $scope.nfLines[vm.nflLines[i].AwayAbbrev] = { [Zingchart json configuration goes here] }
    }
  }
}

Then you can update your HTML to the following:

<divng-repeat="game in vm.nflLines>
  <div zingchart zc-json="nfLines[game.AwayAbbrev]" zc-width="100%"zc-height="350px"></div></div>

Solution 2:

my be you just need to use it without The double curly brace, like this

<divng-repeat="game in vm.nflLines>
  <div zingchart zc-json="game.AwayAbbrev" zc-width="100%"zc-height="350px"></div></div>