Untitled

<!DOCTYPE html>
<html>

  <head>
    <script data-require="angular.js@2.0.0-alpha.28" data-semver="1.3.0" src="https://code.angularjs.org/1.3.0/angular.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body ng-app="TestApp" ng-controller="MainController">
    <table>
      <tbody>
        <tr ng-repeat="c in data">
          <td ng-if="c.type =='fixed'">Fixed</td>
          <td ng-if="c.type =='hourly'">Hourly</td>
          <td ng-if="c.type =='fixed'">{{c.fixed_rate}}</td>
          <td ng-if="c.type =='hourly'">{{c.hourly_rate}}</td>
        </tr>
      </tbody>
    </table>
  </body>

</html>

// Code goes here
var app = angular.module('TestApp', []);

app.controller('MainController', function ($scope) {
  $scope.data = [
    {
      type: 'fixed',
      fixed_rate: '10'
    },
    {
      type: 'hourly',
      hourly_rate: '11'
    },
    {
      type: 'fixed',
      fixed_rate: '12'
    },
    {
      type: 'hourly',
      hourly_rate: '13'
    },
    {
      type: 'fixed',
      fixed_rate: '14'
    },
    {
      type: 'hourly',
      hourly_rate: '15'
    }
  ];
});

/* Styles go here */