Basically, I am building a massive app, using SailsJS and AngularJS.
I'm ratter new to both of them.
I've started this app with few Controllers, but seeing how it's getting messy, I started to move the interaction with my Backend API into Services (mostly the $http functions). I quickly noticed that the "asynchonousity" of it messed most of my logic.
I never used the $q of Angular, and $http kind of do it by itself so I looked online to see the best practice and found this post : AngularJS services and promises best practice
As it's from 2016, I was wondering if it is still considered the best practice, and if it is exactly like that that I should build my Services.
It still is considered the best practice. You can use Promise Chaining in order to structure your code timewise.
You may want to see this article for further details.
Related
Have we got some good, easy to use tutorials for working with API's? Im writing a UI for an API im developing and want to really learn how to use AngularJS properly.
thanks
In Angular, the $resource service is designed specially for consuming REST services. You can find the documentation (and a few samples) for $resource at https://docs.angularjs.org/api/ngResource/service/$resource.
As a backend developer I am little bit struggling with Angular UI MVC concept.
I am trying to draw parallels to my backend MVC so I can understand mindset behind Angular better.
On my backend I have services talking to repositories(or DAOs (Data Access Objects) how we called them in past), controllers calling services to do the job(as they only transport data and not do heavy lifting) and talk to the client(ie browser) and my Model is a combo of(DTOs (Data Transfer Objects) and Entities as of ORM).
As I am inherently inspired by having backend only ever to return/accept JSON(big no to JSP,FreeMarker,Velocity and all others which make my testing life so hard). I would say that on my backend I only have Model-Controller. From the backend perspective my View is AngularJS as JSON data I return could be labelled as part of my Model but it is definitely not my View.
Now when I start to think about UI MVC as of AngularJS I don't understand who should use $http service to talk to backend. The endless examples scattered across the web do not help me. They are either too minimalist or don't show the usage of $http in the full context(simply called from controllers).
I could argue easily for both.
Case A: If AngularJS treats backend as Model then it is the responsibility of angular's services to call $http to talk to backend to retrieve/post data. Here angular controllers still act as basic transport between View and Model ocassionally calling services to get and process data from backend.
Case B
I could also say, hold on - "no", if angular's controllers role is solely to transport then they should get data from backend and deliver to required destination i.e. angular's service/view(if no further processing required).
So which one is "right"? Or at least widely accepted by UI/fullstack devs?
Controllers should only be connecting data and logic with the view and in the most minimal way possible. A bulky controller suggests that either the view needs to be divided up or logic needs to be abstracted into services. $http calls definitely belong in services. The controller doesn't care how the data comes, just that it comes. So:
// controller doesn't care how
getData().then(function(data) {
VS:
// controller is too concerned with "how"
$http.get('/the/path').then(function(data) {
It is typical to see $http calls in controllers in sample code, but not in professional production code.
I would strongly suggest Case A: having this in a service.
Think of Angular controllers as owning each specific piece of view they are assigned to, with services providing ready-made functionality for those controllers.
Also note that a single page can have many views, each of which could be bound to its own instance of a given controller. So it doesn't really make sense to have $http-based functions etc being instantiated a bunch of times. For a service, it will be instantiated once and then shared across any controller that injects it. This is also a great way to share data between controllers, and is one of the strongest reasons to use a service for any given task.
One other suggestion is that thinking of Angular as MVC can lead to issues. Angular is flexible enough to follow multiple design patterns, hence the MVW (Model View Whatever) moniker, but the majority of applications I have seen tend to follow the MVVM pattern. For this reason I would say that the controller should never have knowledge of $http in most cases.
I'm planning to build a webpage that compares large amounts of products.
I need faceted search/filters for that, so the visitor can filter the product on price/color etc.
I couldn't find a ready to implement webshop script for that, so I'm planning to build it myself.
I'm a fan of Laravel, but to avoid page refreshes if the user is changing the filters in the side bar, you need a kind of AJAX calls to your Eloquent ORM.
So that's when AngularJS can be handy, but now I'm confused if I do need Laravel for such a stack. Because if you use AngularJS and MongoDB, you don't need Laravel at all.
So I'm not sure what is best practice.
Disclaimer: I know nothing about Laravel, but a quick google tells me it's a PHP framework for making a restful API.
The 'standard' stack for angular apps at the moment is the "MEAN" stack. That is: MongoDb, Express, Angular, Node. I'm not sure this can be considered a "Best Practice", because it's not necessarily better, but it is definitely the common practice, and as such will be easier to get support and help with.
All that being said, angular really doesn't care about the back-end. It's a front-end framework for making single page web applications. All it really needs is a decent API that you can access by creating a custom service. There is no reason you can't replace node and express with PHP and laravel, and mongo with SQL, you just won't get such a nice acronym!
tl;dr
I'm really struggling to find the appropriate pattern here. How should I best configure a generalized provider to a specific use-case? I can't use $http as a dependency in .configure(); can I?
longer, boring explanation:
I am trying to create a generalized provider which I may reuse in Angular. I have it working, however it requires configuration.
The intention is to provide a fallback REST service to use in saving data to the server, but with provision to save offline in local-storage. Therefore, I need to provide appropriate $http calls for each instance of this provider.
Is it possible to provide appropriate $http calls with .configure() or else should I try and figure out how to inject $http into the provider from the start and then configure it afterward??
It's frustrating... and may change in AngularJS 2.0... But for now, yes, it is not possible to do this. There is a very high wall between the .configure() and .run() states, so you can't access $http from a .configure() function. The reason is that it hasn't actually been created. At this stage, all that exists is the provider. Once all of the dependencies are configured, then the http provider will be used to make the real $http service.
I'm not sure exactly what you're trying to do, but there are two excellent AngularJS developers that are good to follow who have some advanced patterns in projects they've shared: Pascal Precht and Brian Ford. Here are two projects that make heavy use of provider/service concepts as well as $http-driven services:
https://github.com/angular-translate/angular-translate
https://github.com/btford/angular-modal
Angular Modal, especially, does $http work to load its templates. There might be use cases in there that are similar to what you're trying to do.
I'd like to use socketstream's RPC over websockets abstraction while using Angular for MVC. Can anyone (probably in the Angular community) point me in the right direction to learn how to use a custom RPC-type data source to update Angular's models in the most idiomatic way?
If you want to simply sync a model with the server, here's a good example to start with that Misko Hevery made for socket.io: https://github.com/mhevery/angular-node-socketio