AngularJS Services 1

AngularJS 1.2.6 Services

by maddin

HTML

<script src="http://code.angularjs.org/1.2.6/angular.js"></script>
<script src="http://code.angularjs.org/1.2.6/angular-resource.js"></script>
<div class="container" ng-controller="MyCtrl">
    <div class="myname">Hello, {{name}}!</div>
    <div class="mytime">The time is {{time}}.</div>
    <div class="myvalue">The Value: {{theValue}}</div>
</div>

CSS

body {
    font-family: Verdana;
}

body .container {
    margin-top: 1em;
    margin-left: 1em;
}

body .container .myname {
    font-weight: bold;
    font-size: large;
}

body .container .mytime {
}

body .container .myvalue {
}

JavaScript

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

//myApp.directive('myDirective', function() {});
//myApp.factory('myService', function() {});

angular.module('myApp').controller('MyCtrl', function($scope, TimeService, OtherService) {
    $scope.name = 'Mars';
    TimeService.get().$promise.then(function(data) {
        $scope.time = data.time;
        OtherService.get({val: data.date}).$promise.then(function(data) {
            $scope.theValue = data.key;
        });
    });
});

angular.module('myApp').service('TimeService', function($resource) {
    return $resource('http://time.jsontest.com/');
});

angular.module('myApp').service('OtherService', function($resource) {
    return $resource('http://echo.jsontest.com/key/:val', {val: '@val'});
});