AngularJS(3)PhoneCat Demo Advance
Test
element('.phone-thumbs li:nth-child(3) img').click();
? ? ? ? expect(element('img.phone').attr('src')).toBe('img/phones/nexus-s.2.jpg’);
Click on the sub element of li and verify the IMG src value.
11. REST and Custom Services
Template
Import the REST client?
? <script src="js/controllers.js"></script>
And put all my model codes in services.js
? <script src="js/services.js"></script>?
Service
Here is how we build the service layer, we use factory to create a service instance.
var phonecatServices = angular.module('phonecatServices', ['ngResource']);
phonecatServices.factory('Phone', ['$resource',
? function($resource){
??? return $resource('phones/:phoneId.json', {}, {
????? query: {method:'GET', params:{phoneId:'phones'}, isArray:true}
??? });
? }]);?
Controller
Leave the lower layer $http, deal with the service object Phone, fetch all the data from there.
$resource is higher than $http, and we use $resource to build the REST client, we create service layer here.
12. Applying Animations
It is powerful and great, but I will not use it right now.
More examples are here?
http://code.angularjs.org/1.2.8/docs/cookbook/index
Guide book is here
http://code.angularjs.org/1.2.8/docs/guide/index
References:
http://code.angularjs.org/1.2.8/docs/tutorial/step_09
http://code.angularjs.org/1.2.8/docs/tutorial/step_11
http://code.angularjs.org/1.2.8/docs/guide/index
http://code.angularjs.org/1.2.8/docs/cookbook/index
?
