Angular: ng-repeat scope - 14410993

http://angularjs.org/

by Nalin Sajwan

HTML

<div class="parent" ng-controller="MyCtrl">
    <div class="child" ng-repeat="color in colors" style="background-color: {{color}};">
        <div style="font-weight: normal; padding: 10px;">
            {{$index + 1}} - {{color}}
        </div>
        <!-- &nbsp; -->
    </div>
</div>

CSS

.parent {
  width: 500px;
  height: 100%;
}

.child {
  border: 1px solid #000000;
  height: 40px;
  width: 200px;
  text-align:center;
  margin: 10px;
  clear: both;
}

JavaScript

var myApp = angular.module('myApp', []);

//myApp.directive('myDirective', function() {});
//myApp.factory('myService', function() {});

function MyCtrl($scope) {
    // $scope.colors = ["#058DC7", "#50B432", "#ED561B", "#DDDF00", "#24CBE5", "#7cb5ec", "#434348", "#90ed7d", "#f7a35c", "#8085e9", "#f15c80", "#e4d354", "#2b908f", "#f45b5b", "#91e8e1", "#696969", "#64E572", "#FF9655", "#FFF263", "#6AF9C4"];
    
    $scope.colors = ["#37A2DA",
"#32C5E9",
"#67E0E3",
"#9FE6B8",
"#FFDB5C",
"#ff9f7f",
"#fb7293",
"#E062AE",
"#E690D1",
"#e7bcf3",
"#9d96f5",
"#8378EA",
"#96BFFF"]
}