AngularJS Grid

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-theme.min.css">
    <script src="//code.jquery.com/jquery.min.js"></script>
    <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
    <script src="//code.angularjs.org/1.2.0-rc.3/angular.min.js"></script>
    <script src="app.js"></script>
</head>
<body ng-app="gridApp">
    <div class="container">
        <div ng-controller="MainController">
            <grid ng-model="list" />
        </div>
    </div>
 </body>
 </html>

angular
  .module('gridApp', [])
    .run(function($rootScope, $log) {
      $rootScope.$log = $log;
    })
    .directive('grid', function ($log) {
      return {
        templateUrl: '_grid.html',
        restrict: 'E',
        scope: {
          rows: '=ngModel'
        },
        link: function postLink(scope, element, attrs) {
          scope.columns = function() {
            var columns = [];
            if (scope.rows[0] instanceof Object) {
              for (var key in scope.rows[0]) {
                if (key !== '$$hashKey') {
                  columns.push(key);
                }
              }   
            }
            return columns;
          };

          scope.setOrder = function (order) {
            if (scope.order !== order) {
              scope.order = order;
              scope.reverse = false;
            } else {
              scope.reverse = !scope.reverse;
            }
          };
        }
      };
    })
    .controller('MainController', function ($scope, $http) {
      $scope.list = [];
      $http.get('http://www.corsproxy.com/finance.yahoo.com/webservice/v1/symbols/allcurrencies/quote?format=json').success(function(data){
        data.list.resources.forEach(function(resource) {
          var i = resource.resource.fields;
          for(var prop in i) {
            if ($.isNumeric(i[prop])) {
              i[prop] = parseFloat(i[prop], 10);
            }
          }
          $scope.list.push(i);
        });
      });
    });

<div>
  <table class="table table-striped">
    <thead>
      <tr>
        <th ng-repeat="col in columns()">
          <a ng-click="setOrder(col)">{{col}}</a> <span ng-show="order == col">
            <span ng-show="!reverse" class="glyphicon glyphicon-chevron-up"></span>
            <span ng-show="reverse" class="glyphicon glyphicon-chevron-down"></span>
          </span></a>
        </th>
      </tr>
    </thead>
    <tbody>
      <tr ng-repeat="row in rows | filter:search | orderBy:order:reverse">
        <td ng-repeat="col in columns()">{{ row[col]}}</td>
      </tr>
    </tbody>
  </table>

  <input type="text" ng-model="search" placeholder="Search" />
  <input type="text" ng-model="order" placeholder="Order" />
</div>