Skip to content

Commit a4a78ee

Browse files
petebacondarwinpetebacondarwin
committed
step-11 custom service and $resource
- Replaced [$http] with [$resource] - Created a custom Phone service that represents the $resource client
1 parent 49b278c commit a4a78ee

File tree

8 files changed

+44
-21
lines changed

8 files changed

+44
-21
lines changed

‎app/index.html

+2
Original file line numberDiff line numberDiff line change
@@ -7,9 +7,11 @@
77
<link rel="stylesheet" href="css/app.css">
88
<script src="bower_components/angular/angular.js"></script>
99
<script src="bower_components/angular-route/angular-route.js"></script>
10+
<script src="bower_components/angular-resource/angular-resource.js"></script>
1011
<script src="js/app.js"></script>
1112
<script src="js/controllers.js"></script>
1213
<script src="js/filters.js"></script>
14+
<script src="js/services.js"></script>
1315
</head>
1416
<body>
1517

‎app/js/app.js

+2-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,8 @@
55
var phonecatApp = angular.module('phonecatApp', [
66
'ngRoute',
77
'phonecatControllers',
8-
'phonecatFilters'
8+
'phonecatFilters',
9+
'phonecatServices'
910
]);
1011

1112
phonecatApp.config(['$routeProvider',

‎app/js/controllers.js

+7-11
Original file line numberDiff line numberDiff line change
@@ -4,20 +4,16 @@
44

55
var phonecatControllers = angular.module('phonecatControllers', []);
66

7-
phonecatControllers.controller('PhoneListCtrl', ['$scope', '$http',
8-
function($scope, $http) {
9-
$http.get('phones/phones.json').success(function(data) {
10-
$scope.phones = data;
11-
});
12-
7+
phonecatControllers.controller('PhoneListCtrl', ['$scope', 'Phone',
8+
function($scope, Phone) {
9+
$scope.phones = Phone.query();
1310
$scope.orderProp = 'age';
1411
}]);
1512

16-
phonecatControllers.controller('PhoneDetailCtrl', ['$scope', '$routeParams', '$http',
17-
function($scope, $routeParams, $http) {
18-
$http.get('phones/' + $routeParams.phoneId + '.json').success(function(data) {
19-
$scope.phone = data;
20-
$scope.mainImageUrl = data.images[0];
13+
phonecatControllers.controller('PhoneDetailCtrl', ['$scope', '$routeParams', 'Phone',
14+
function($scope, $routeParams, Phone) {
15+
$scope.phone = Phone.get({phoneId: $routeParams.phoneId}, function(phone) {
16+
$scope.mainImageUrl = phone.images[0];
2117
});
2218

2319
$scope.setImage = function(imageUrl) {

‎app/js/services.js

+8
Original file line numberDiff line numberDiff line change
@@ -2,3 +2,11 @@
22

33
/* Services */
44

5+
var phonecatServices = angular.module('phonecatServices', ['ngResource']);
6+
7+
phonecatServices.factory('Phone', ['$resource',
8+
function($resource){
9+
return $resource('phones/:phoneId.json', {}, {
10+
query: {method:'GET', params:{phoneId:'phones'}, isArray:true}
11+
});
12+
}]);

‎bower.json

+2-1
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@
1010
"angular-mocks": "1.4.x",
1111
"jquery": "~2.1.1",
1212
"bootstrap": "~3.1.1",
13-
"angular-route": "1.4.x"
13+
"angular-route": "1.4.x",
14+
"angular-resource": "1.4.x"
1415
}
1516
}

‎test/karma.conf.js

+1
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ module.exports = function(config){
66
files : [
77
'app/bower_components/angular/angular.js',
88
'app/bower_components/angular-route/angular-route.js',
9+
'app/bower_components/angular-resource/angular-resource.js',
910
'app/bower_components/angular-mocks/angular-mocks.js',
1011
'app/js/**/*.js',
1112
'test/unit/**/*.js'

‎test/unit/controllersSpec.js

+14-5
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,16 @@
33
/* jasmine specs for controllers go here */
44
describe('PhoneCat controllers', function() {
55

6+
beforeEach(function(){
7+
this.addMatchers({
8+
toEqualData: function(expected) {
9+
return angular.equals(this.actual, expected);
10+
}
11+
});
12+
});
13+
614
beforeEach(module('phonecatApp'));
15+
beforeEach(module('phonecatServices'));
716

817
describe('PhoneListCtrl', function(){
918
var scope, ctrl, $httpBackend;
@@ -19,11 +28,11 @@ describe('PhoneCat controllers', function() {
1928

2029

2130
it('should create "phones" model with 2 phones fetched from xhr', function() {
22-
expect(scope.phones).toBeUndefined();
31+
expect(scope.phones).toEqualData([]);
2332
$httpBackend.flush();
2433

25-
expect(scope.phones).toEqual([{name: 'Nexus S'},
26-
{name: 'Motorola DROID'}]);
34+
expect(scope.phones).toEqualData(
35+
[{name: 'Nexus S'}, {name: 'Motorola DROID'}]);
2736
});
2837

2938

@@ -54,10 +63,10 @@ describe('PhoneCat controllers', function() {
5463

5564

5665
it('should fetch phone detail', function() {
57-
expect(scope.phone).toBeUndefined();
66+
expect(scope.phone).toEqualData({});
5867
$httpBackend.flush();
5968

60-
expect(scope.phone).toEqual(xyzPhoneData());
69+
expect(scope.phone).toEqualData(xyzPhoneData());
6170
});
6271
});
6372
});

‎test/unit/servicesSpec.js

+8-3
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,12 @@
11
'use strict';
22

3-
/* jasmine specs for services go here */
4-
53
describe('service', function() {
64

7-
});
5+
// load modules
6+
beforeEach(module('phonecatApp'));
7+
8+
// Test service availability
9+
it('check the existence of Phone factory', inject(function(Phone) {
10+
expect(Phone).toBeDefined();
11+
}));
12+
});

0 commit comments

Comments
 (0)