Permalink
Browse files

AngularJS Tutorial Part 2 - Connecting the Star Wars API in an Angula…

…r Service
  • Loading branch information...
aashnisshah committed Aug 20, 2016
1 parent 14dc5a4 commit 9fd51638c5861b6c928555b2a6cd36c2415715f5
Showing with 40 additions and 3 deletions.
  1. +1 −1 app.js
  2. +8 −1 controllers/main.js
  3. +3 −0 index.html
  4. +21 −0 services/swapi.js
  5. +7 −1 views/main.html
View
2 app.js
@@ -1,4 +1,4 @@
var angularApp = angular.module('AngularApp', ['ngRoute']);
var angularApp = angular.module('AngularApp', ['ngRoute', 'swapi']);
angularApp.config(['$routeProvider',
function($routeProvider){
View
@@ -1,7 +1,14 @@
angularApp.controller('MainCtrl', [
'$scope',
function($scope){
'SwapiService',
function($scope, SwapiService){
$scope.heading = "Hello World";
$scope.message = "This is me";
SwapiService.people()
.then(function(data) {
$scope.data = data.data.results;
});
}
]);
View
@@ -12,6 +12,9 @@
<!-- Controllers -->
<script type="text/javascript" src="controllers/main.js"></script>
<!-- Services -->
<script type="text/javascript" src="services/swapi.js"></script>
</head>
<body>
View
@@ -0,0 +1,21 @@
var services = angular.module('swapi', []);
services.factory('SwapiService', ['$http',
function($http){
function Swapi(){};
Swapi.domain = 'http://swapi.co/api';
Swapi.people = function(){
var path = '/people';
var url = Swapi.domain + path;
return $http.get(url)
.then(function(response){
return response;
});
};
return Swapi;
}
]);
View
@@ -1,2 +1,8 @@
<h1>{{ heading }}</h1>
<p>{{ message }}</h1>
<p>{{ message }}</h1>
<div>
<div ng-repeat="person in data">
<p>{{person}}</p>
</div>
</div>

0 comments on commit 9fd5163

Please sign in to comment.