<!DOCTYPE HTML>
<html xmlns:ng="http://angularjs.org">
<head>
  <script type="text/javascript" src="../src/angular-bootstrap.js" ng:autobind></script>
  </script>
  <script type="text/javascript">
    angular.service('myService', function($resource){
      this.myData = $resource('resource_json_date.json');
    }, {$inject:['$resource'], $creation:'eager'});

    /* The Controller object */
    MyController = function() {
      this.inlineData = angular.fromJson('{reportDate:"2010-10-13T17:37:00Z"}');
      this.jsonData = this.myData.get();
    };



  </script>
</head>
<body ng:controller="MyController" ng:init="$window.$root = this">
  <h3>This data is loaded with angular.fromJson:</h3>
  {{ inlineData.reportDate | date }}
  <hr/>
  <h3>This data is loaded from a resource using a service:</h3>
  <p>Name: {{ jsonData.name }}</p>
  <p>Parsed date: {{ jsonData.reportDate }} (A date should be displayed here)</p>

</body>
</html>