kuanb
kuanb

Reputation: 1708

Leveraging ui-router in Angular with tabs

I have an Angular SPA that is using ui.router. One page has 4 tabs on it. Currently, one controllers supports all 4 tabs - this is unsustainable as the code is becoming messy (too much logic per tab).

I see two solutions: 1. These shouldn't be tabs; they should be separate pages (not ideal, though). 2. There is some way to associate portions of a controller with only certain tabs (or maybe a different controller with each tab?) or some way to break a single controller up into smaller components.

Any ideas on the latter (#2) would be terrific.

Upvotes: 1

Views: 52

Answers (1)

Obada Kadri
Obada Kadri

Reputation: 175

You can create multiple routes that point to the same template/controller Then in that 'tab group' controller have an ng-controller inside each tab. The tab will be activated depending on the $location.path() value

I created a simple plunk here http://plnkr.co/edit/88SPMteu9MFFbqMc0cYy

Upvotes: 1

Related Questions