1

These are the premises I'm trying to implement with ui-router:

  • The root page has a ui-view; on click it is populated with the main page (main.html).

  • The main page has two named ui-view's: view1 and view2.

  • The main page also has four links to populate (1) page11 or page12 in view1, (2) page21 or page22 in view2 (in any combination).

  • I use abstract states to be able to select which page goes to its respective named view.

I posted my attempt on plunker, any ideas if this is achievable?

UPDATE

I think this plunk explains more clearly what I'm trying to achieve. Click on page11 and then on page21; each will display their template and clear the other. I need both templates to be shown simultaneously.

ps0604
  • 1,227
  • 23
  • 133
  • 330
  • yes, this is achievable. What is the question? – akonsu Dec 12 '14 at 15:12
  • how can be implemented? Please see my attempt on plunker. thanks – ps0604 Dec 12 '14 at 15:15
  • create states for each page combination that you need to display. The state for the main page is a child of the root state, and these for the sub-pages are children of the main page's state. that is all. – akonsu Dec 12 '14 at 15:19
  • how can I select **dynamically** which template I can populate in each named view? When you go to a specific state the template names are predetermined in the view declaration. – ps0604 Dec 12 '14 at 15:26
  • for each combination you will have a state (this is first that comes to mind, you can end up with a lot of states if your real set of pages is big, but for this plnkr example it is still manageable), and there you will have all your pages listed. At least this approach can give you an ability to write your first iteration. I do not know how to assign templates to views dynamically. Need to read on it. – akonsu Dec 12 '14 at 15:31
  • I guess the question is whether each combination of templates that you are trying to achieve has a URL that can be navigated to to create this combination. If not, then ui-router maybe is not the right tool. – akonsu Dec 12 '14 at 15:33
  • My issue is not the combinations, the issue is that I have two named views on the page and I need to select on which named view I populate the template – ps0604 Dec 12 '14 at 15:38
  • again, a state populates views. you just transition to a state. – akonsu Dec 12 '14 at 15:39
  • here is a link that can also help: http://stackoverflow.com/questions/24727042/angularjs-ui-router-how-to-configure-dynamic-views – akonsu Dec 12 '14 at 15:42

1 Answers1

0

This is how I solved this problem: I created a directive that compiles markup (using $compile) and used two directives in my html page, each with a different markup.

ps0604
  • 1,227
  • 23
  • 133
  • 330