Following the tips in Best practice of RestAngular, I am trying to follow the suggestions (Restangular Service - Factory and exampleService) and it's not working.
The following source code includes two sections one. Without Angular Factory, that works. And with Factory that is not working:
<html ng-app="angularexample">
<head>
<script src="https://code.angularjs.org/1.3.14/angular.min.js"></script>
<script src="https://code.angularjs.org/1.3.14/angular-route.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/restangular/1.5.1/restangular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
<script src="script.js"></script>
</head>
<body>
<div ng-Controller='MainCtrl'>
<div ng-repeat="user in users">
Name : {{user.name}}<br>
Age : {{user.age}}<br>
ID : {{user.id}}<br>
Change name:<input type="text" ng-model="user.name"/><button type="submit" ng-click="user.put()">Update</button><br/>
Remove ID:<input type="text" ng-model="user.id"/><button type="submit" ng-click="user.remove()">Delete</button><br/>
</div>
<div>
add new: <br/>
Name : <input type="text" ng-model="newUser.name"/><br/>
Age : <input type="text" ng-model="newUser.age"/><br/>
<button type="submit" ng-click="add()">add</button>
</div>
</div>
<div ng-Controller='ExampleCtrl'>
My Title {{title}} <br/>
<div ng-repeat="user in examples">
Name : {{user.name}}<br>
Age : {{user.age}}<br>
ID : {{user.id}}<br>
Change name:<input type="text" ng-model="user.name"/><button type="submit" ng-click="user.put()">Update</button><br/>
Remove ID:<input type="text" ng-model="user.id"/><button type="submit" ng-click="user.remove()">Delete</button><br/>
</div>
<div>
add new: <br/>
Name : <input type="text" ng-model="newUser.name"/><br/>
Age : <input type="text" ng-model="newUser.age"/><br/>
<button type="submit" ng-click="add()">add</button>
</div>
</div>
</body>
</html>
http://plnkr.co/edit/y22aBpcUwV1btrKB5jVM?p=preview
Here is the error screen:
http://i57.tinypic.com/334rfqu.jpg
The working reference is pictured as my REST service is not hosted . Yet my REST service is just having two fields namely - name and age.
/**
* User.js
*
* @description :: This is the sample Model for Sails JS to create REST API.
* @docs :: http://sailsjs.org/#!documentation/models
*/
module.exports = {
attributes: {
name : {
type : 'string'
},
age : {
type : 'integer'
}
}
};
What could be an issue in my code? I would like to follow the best practices to build a big application.
You are calling the then method without returning the associated promise from your factory methods, you should return the promise, like
Now the methods will make the request and return the assoiciated promise on which you can call the then method.