To be or not to be.That is a question!

---源于莎士比亚的《哈姆雷特》

导航

Angular service

<!DOCTYPE html>
<html lang="en" ng-app="myApp">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script src="lib/angular.js"></script>
</head>
<body>
    <div ng-controller="ServiceCtrl">
        <label for="username">
            Type in a Github username
        </label>
        <input type="text" ng-model="username" placeholder="Enter a Github username">
        <ul>
            <li ng-repeat="event in events">
                {{event.actor.login}} {{event.repo.name}}
            </li>
        </ul>
    </div>
    <script>
        angular.module('myApp.services', [])
        .factory('githubService', function ($http) {
            var githubUrl = 'https://api.github.com';

            var runUserRequest = function (username, path) {
                return $http({
                    method: 'JSONP',
                    url: githubUrl + '/users/' + username + '/' + path + '?callback=JSON_CALLBACK'
                });
            }
            return {
                events: function (username) {
                    return runUserRequest(username, 'events');
                }
            }
        });

        angular.module('myApp', ['myApp.services'])
        .controller('ServiceCtrl', function ($scope, githubService) {
            $scope.$watch('username', function (newUsername) {
                githubService.events(newUsername).success(function (data, status, headers) {
                    $scope.events = data.data;
                })
            });
        });
    </script>
</body>
</html>

 

posted on 2014-08-28 19:37  Ijavascript  阅读(298)  评论(0编辑  收藏  举报