1

I've been going over the current (angular 1.2.16) routing and multiple views method for angular. Its detailed here. In this we see that for every route there is a get request to load the partial html.

How would I change this so all get requests for views happen when the app instantiates and then the routes switch the views without making further calls to the server?

PrimeLens
  • 2,547
  • 4
  • 23
  • 28
  • AngularJS applications run in a browser. Where do you envision storing view files? Switching of views involves modifications of the DOM tree. – PM 77-1 Jun 01 '14 at 00:02
  • 1
    Take a look at the template cache... http://stackoverflow.com/questions/18714690/is-there-a-way-to-preload-templates-and-controllers-when-using-angularjs-routing – Anthony Chu Jun 01 '14 at 00:13
  • You can use ng-swtich. Instead of pages, wrap the partial content into a div. – Gaurav Jun 01 '14 at 02:57
  • @AnthonyChu you should make that your answer instead of a comment, its a good answer – PrimeLens Jun 04 '14 at 02:45
  • @hasH yours is another good idea, why not make it into an answer instead of a comment? I'm interested in this idea of using ng-switch. I'm guess you also meant to lead the partials into the divs using ng-inlcude? – PrimeLens Jun 04 '14 at 02:47
  • possible duplicate of [Is there a way to make AngularJS load partials in the beginning and not at when needed?](http://stackoverflow.com/questions/12346690/is-there-a-way-to-make-angularjs-load-partials-in-the-beginning-and-not-at-when) – andyp Jun 04 '14 at 20:23
  • @andyp - nice find, yes I would agree. But the solution here provided by hasH is not mentioned in the other thread and it is what I was looking for the limited page webapp that I'm building – PrimeLens Jun 05 '14 at 01:10

2 Answers2

0

You can do what they suggest here and use ui-router

i.e. 

    <!-- index.html -->
<body>
    <div ui-view="viewA"></div>
    <div ui-view="viewB"></div>
    <!-- Also a way to navigate -->
    <a ui-sref="route1">Route 1</a>
    <a ui-sref="route2">Route 2</a>
</body>
Community
  • 1
  • 1
Quinn Wilson
  • 7,995
  • 1
  • 22
  • 31
  • This reminds me of the good old times, when jQuery was the default answer to every javascript question... – gkalpak Jun 04 '14 at 05:35
0

Suppose that you want to change the content of a div depending on what is stored in data.mode. You need to have first a mechanism to change the value of data.mode and that's entirely up to you.

<div ng-switch on="data.mode">
    <div ng-switch-when="first_value">
        <!--Your first partial page content-->
    </div>

    <div ng-switch-when="second_value">
        <!--Your second partial page-->
    </div>

    <div ng-switch-when="second_value">
        <!--Your third partial page-->
    </div>

    <div ng-switch-default>
        <!--Default content when no match is found.-->
    </div>
</div>
Gaurav
  • 3,614
  • 3
  • 30
  • 51
  • Perfectly unmaintainable ! – gkalpak Jun 04 '14 at 05:33
  • Well, yes. But what would you do if your main intention is to reduce the GET calls ? Your ng-include and ng-view like to hit server everytime. – Gaurav Jun 04 '14 at 05:39
  • There is the templateCache, there is grunt-angular-templates (and similar packages) and there is the `script` directive... – gkalpak Jun 04 '14 at 05:45
  • what if the intention of the user is not to make any get calls for dynamic load ? BTW, thanks for pointing to templateCache. – Gaurav Jun 04 '14 at 06:03
  • 2 out of the 3 solutions I proposed involve 0 additional get calls. Have youeven looked at the script **directive** ? – gkalpak Jun 04 '14 at 06:53
  • Yes. I have. I get your point. I tried to answer the question as per OP's suggestion. I wasn't aware of any of your suggestions. That' how SO makes you learn. Thanks. – Gaurav Jun 04 '14 at 07:08
  • Feel free to investigate those approaches further and update your answer :) – gkalpak Jun 04 '14 at 07:15
  • @ExpertSystem - templateCache was already mentioned by Anthony Chu. I specifically asked hasH to expand on ng-switch, see comments on main post. – PrimeLens Jun 04 '14 at 13:24
  • @PrimeLens: I know you did - I can read comment on main ost :) I just commented that this solution (that hasH proposed in comments and you suggested should be written as an answer and hasH wrote as an answer) is a bad approach for mainatinability reasons (including inability to reuse templates). And then we had a useful conversation where I pointed out some alternatives which I believe hasH found interesting. Finally, I suggested hasH could investigate them more and update their answer (so it does not propose a perfectly unmantainable solution any more). – gkalpak Jun 04 '14 at 13:48
  • @PrimeLens: And I know templateCache was mentioned by Anthony, but it doesn't mean I can't mention it myself (especially since it is a very useful thing). Besides, templateCache alone won't solve any problem - it depends on how you use the templateCache. And since Anthony hadn't added an answer with their suggestion, it would be very useful if someone else did :) – gkalpak Jun 04 '14 at 13:49