Angular.jsの練習5(イテレーションでの変数) #JavaScript

イテレーションの時に使える変数の確認

practice5.html

<!DOCTYPE html>
<html ng-app="myApp">
<head>
  <meta charset="UTF-8" />
  <title>AngularJS TIPS</title>
  <script src="https://code.angularjs.org/1.4.8/angular.min.js"></script>
  <script src="1_myscript.js"></script>
  <style type="text/css">
  .even {
    background: #ccc;
  }
  .odd {
    background: red;
  }
  </style>
</head>
<body>
  <div ng-controller="myCtrl">
  <ul>
    <li ng-repeat="user in users">
      {{user.name}}
      {{$index}}
      {{$first}}
      {{$middle}}
      {{$last}}
    </li>
  </ul>
  <ul>
    <li ng-repeat="user in users" ng-class-even="'even'" ng-class-odd="'odd'">
      {{user.name}}
      {{$index}}
      {{$first}}
      {{$middle}}
      {{$last}}
    </li>
  </ul>
  </div>
</body>
</html>

1_myscript.js

(function(){
  angular.module('myApp', []);
  angular.module('myApp')
    .controller('myCtrl', ['$scope', function($scope) {
        $scope.users = [
          {"name":"urano", "age":35, "money":50000},
          {"name":"nakanishi", "age":25, "money":1000000},
          {"name":"shinji", "age":45, "money":444000},
          {"name":"john", "age":49, "money":424000},
          {"name":"yna", "age":42, "money":934100},
          {"name":"miha", "age":25, "money":124000},
          {"name":"kazu", "age":43, "money":834000},
          {"name":"taka", "age":15, "money":799000}
        ];
        $scope.today = new Date();
    }]);
})();