Best practice using angular architecture with components

Question

I'm trying to wrap my mind arround angular components, to understand components better I'm developing a simple todo crud using the component architecture.

The problem is that I think it makes sense to put all operations of the crud in a single controller thus respecting the single responsibility principle but at the same time it is a good practice (I think) to split the views (one for list todos and delete another to create/update todos).

I know that multiple views with a single controller can be achieved using two separate components registering the same controller and some ng/ui-route magic, but using this blows up the encapsulation proposal that the components try to offer.

So, has anyone figured out a good solution to this problem?

take a look at angular2 todo, it will give you the idea github.com/ColinEberhardt/angular2-todo — Rathma
– Rathma, Commented Jul 25, 2016 at 19:56
Can you write a basic code to see what is your issue? crud functions should be put in a service not in a controller. — gyc
– gyc, Commented Jul 26, 2016 at 11:55
@HadiAmiri thanks for the comment but the scope of the angular2 todo is simple, so all operations were implemented in a singe view (the todo has only one field). — danillosl
– danillosl, Commented Jul 26, 2016 at 16:51
@gyc thanks for the comment, I agree, all the crud operations has to be implemented and angular has the $resource which make it easy, the problem I described appears when it makes sense to split the component in multiple views but the controller must be the same to respect the single responsibility principle. — danillosl
– danillosl, Commented Jul 26, 2016 at 16:58

Emiliano Barboza · Accepted Answer · 2016-07-25 19:48:24Z

1

I think you have to consider always the modularity, so you can use create a service to handle all the crud and API operations and it can be reused by your other controllers and directives. Here is an example of how we did in our project. This is the git repo of on of my partners.

https://github.com/leog/epsilon

answered Jul 25, 2016 at 19:48

Emiliano Barboza

4854 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

danillosl Over a year ago

Thanks for the answer , I read the first part of your series , might be what I need I will read the rest and analyze the project.

al32 · Accepted Answer · 2016-07-25 20:24:30Z

1

Here is demo from jhipster repository link

Using angular ui-router in bank-account.state.js described all states with views and controllers.

answered Jul 25, 2016 at 20:24

al32

1093 bronze badges

1 Comment

danillosl Over a year ago

thanks for the answer, that looks great! the only probleam I see is that the components cannot be export to another project that don't respect the view structure.

Collectives™ on Stack Overflow

Best practice using angular architecture with components

2 Answers 2

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related