Angular - Email repeat JSON

Angular - Email repeat JSON

by Andrew Pougher

HTML

<div ng-app="myApp">
    <div class="inbox" ng-controller="EmailsCtrl">
        My Inbox:
        <ul>
            <li ng-repeat="message in emails.messages">
                <p>From: {{ message.from }}</p>
                <p>Subject: {{ message.subject }}</p>
                <p>{{ message.sent | date:'MMM d, y h:mm:ss a' }}</p>
            </li>
        </ul>
    </div>
</div>

CSS

* {
    font:300 13px/1.4'Helvetica Neue', Helvetica, Arial;
}
.inbox {
    padding:15px;
}
ul {
    list-style:none;
    padding:0;
}
ul li {
    padding:15px;
    overflow:hidden;
    background:#f9f9f9;
    border-top:1px solid #e5e5e5;
}
ul li:last-child {
    border-bottom:1px solid #e5e5e5;
}

JavaScript

var mockDataForThisTest = ([
    {
        "from": "Steve Jobs",
        "subject": "I think I'm holding my phone wrong :/",
        "sent": "2013-10-01T08:05:59Z"
    },{
        "from": "Ellie Goulding",
        "subject": "I've got Starry Eyes, lulz",
        "sent": "2013-09-21T19:45:00Z"
    },{
        "from": "Michael Stipe",
        "subject": "Everybody hurts, sometimes.",
        "sent": "2013-09-12T11:38:30Z"
    },{
        "from": "Jeremy Clarkson",
        "subject": "Think I've found the best car... In the world",
        "sent": "2013-09-03T13:15:11Z"
    }
]);

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

myApp.controller('EmailsCtrl', ['$scope', function ($scope) {

    $scope.emails = {};

    $scope.emails.messages = mockDataForThisTest;

}]);