angular-xhr
Send $http
requests with directives.
- Less lines of code for your controllers.
- Explicitly address your requests in your templates.
- Minus one dependency (
$http
) for your controller.
Why?
There are circumstances where a certain part of your app only has to send an $http
request to an API, and repetitive $http
in our controller can be tedious and unacceptable.
You can send a POST
to api/v1/users/
with just this code:
<button
srph-xhr="api/v1/users"
request-type="POST"
request-data="formData">
Create User
</button>
Instead of having something the code below which is, honestly, quite tedious in some situations:
// user-create.controller.js
app.controller('UserCreateController', function($scope, $html) {
$scope.request = function() {
// $http...
}
});
<!-- user-create.html -->
<!-- input.. -->
<button type="button" ng-click="request()">Create User</button>
Let's Get Started
Getting started is very easy.
Installation
Add this library (angular-srph-xhr.js
or angular-srph-xhr.min.js
) in your project after angular, like so. It must be in proper order.
<script src="/path/to/angular.min.js"></script>
<script src="/path/to/angular-srph-xhr.min.js"></script>
Angular-XHR is available via [Bower]!
bower install angular-srph-xhr
While it is also possible to use the one provided by CDNs.
<script src="https://cdn.rawgit.com/srph/angular-xhr/dist/angular-srph-xhr.js"></script>
<script src="https://cdn.rawgit.com/srph/angular-xhr/dist/angular-srph-xhr.min.js"></script>
Add srph.xhr
in your app's angular.module
dependencies
angular.module('myApp', [/** other deps */, 'srph.xhr'];
Usage
Check the API Reference, Usage
Important Notes
I wrote this as proof-of-concept for utilizing directives to its limit, as written here. I'd like to keep this library as simple as possible.
I am in need of contributors (especially feat requests). I have not yet touched the other features in the XHR
or $http
API, so please feel free to issue a feature.
Announcements
As of 12/30/2014, I am technically stopping continuous development of this project after the release of v0.3
. I'm not sure which kind of design to aim for. If you find it helpful, please feel free to issue a feature (for me to continue), to copy the idea, or to fork as you wish.
After months of fiddling with the project, I realized that this could be paired well with Restangular, which is a great library on top of $http
.
Status
As of 0.3.1
:
- Send requests
- Smart URLs (Removing trailing slashes)
- Base URL
- Send headers, set base headers
- (Pre-send phase) Action / expression to execute before running the
$http
- Post-action / expression to execute after the $http (final block for the promise)
- Pre-action can cancel the request fn
- Send query parameters
- File uploads
This is an alpha release, and it is not recommended or suitable for production.
Name
Yes, this is very misleading.
However, it was a wiser decision to spend my free time on studying ($http
, Angular, etc..), and updating the library, instead of changing lots of parts of the docs, changing lots of links, as well as re-registering on [Bower]. Also, given the fact that this is merely a proof-of-concept, and currently in alpha
.
Docs / Examples
See the introductory docs here, API reference / docs, and the demos here.
Contribution
For features or fixes, I would suggest to submit an issue first before submitting a pull request. This avoids closed pull-requests; useless work.
========= ================
| issue | -> | pull-request |
========= ================
Make sure to check the Developer Reference doc.
Changelogs
View file.
Links / References
Acknowledgements
angular-xhr © 2014+, Kier Borromeo (srph). Released under the MIT License.
srph.github.io · GitHub @srph · Twitter @_srph