CODEWITHSUNDEEP
javascriptangularjsangularjs-service
SLearner
SLearner

Reputation: 1439

Data and Models in AngularJS

I have this WebApp with this HTML layout

Nav-column-| Center Column---- | Right Column

Link1---------|Data corresponding|Data Corresponding to Link1-A

Link2---------| to Nav-column------| (ie based oon Center Column Link)

Link3---------| Link1-A--------------|

----------------| Link1-B------------- |

I want to fully use AngularJS' strengths. I have separated the three columns are three different views, with Nav-column being loaded on page load. Now, I want to change the MODEL/DATA being displayed in the center column based on the link user clicks on the nav-column. How do I do that?

I understand that I dont need to change the view(which is stupid, I think). I need to change the data only.

Upvotes: 1

Views: 93

Answers (2)

Frank6
Frank6

Reputation: 1203

I suggest you to a look to this great blog post proposing a solution for nesting views and routing. You will find a complete solution to manage views using ng-switchand ng-include similar to what Benoit Tremblay is saying.

http://www.bennadel.com/blog/2441-Nested-Views-Routing-And-Deep-Linking-With-AngularJS.htm

Upvotes: 1

Benoit Tremblay
Benoit Tremblay

Reputation: 728

You have pretty much two options:

  1. You use ng-show and a scope variable shared between your views. (your center view will become clutter if you have a lot of stuff, great if you don't have too much going on)

  2. You use a clean ng-include and a scope variable with the view you want to show. Great if you have a lot of possibilities.

Or you can mix both if you want to group some of them. It's totally up to what you need.

Upvotes: 0

Related Questions