2

I have an angular app with a page and dynamic content. I use ui router for routing.

I want user to see static html which server side rendering will return it, and when angular is loaded, change html content with ur router templates.

sample static html is:

<div ui-view>
  <div>Lorem Ipsum</div>
  <p>Lorem Ipsum</p>
  <span>Lorem Ipsum</span>
<div> 

sample ui router template is:

<div>
  <div>{{myModel}}</div>
  <p>{{myModel2}}</p>
  <span>Lorem Ipsum</span>
<div>

My aims:

  1. User should see some static html, before dynamic content is loaded. Dynamic content will replace it.

  2. Search engines should track static files, not something like <p>{{myModel2}}</p>

fyelci
  • 1,399
  • 2
  • 16
  • 27

1 Answers1

1

I think you can make static content visible before ui-router is resolved like this:

<ui-view>
  <div>Lorem Ipsum</div>
  <p>Lorem Ipsum</p>
  <span>Lorem Ipsum</span>
</ui-view>

Using ui-view as custom tag will render inner HTML without any changes to it, however when route is resolved this content will be replaced with actual route template.

dfsq
  • 191,768
  • 25
  • 236
  • 258
  • It worked, thank you so much. I tried it as
    in first place, it didn't work. When I try your explanation it worked.
    – fyelci Jun 01 '16 at 07:29