Tuesday, 28 March 2017

What problem can arise with refreshing the a Angular page ?


While navigating the pages when you refresh (F5) the included/child page , the style may go away and tiles layout may lost.

Solution
Add base tag with URL / on the main layout page

<html ng-app="module1">
  <head>
    <title>Hello</title>
    <base href="/" />
    <script src="scripts/angular.min.js" />
    <script src="scripts/angular-route.min.js" />

  </head>
  <body>
    <table>
       <tr>
          <td colspan="2" class="header">
            <h1>Website header</h1>
          </td>
       </tr>
       <tr>
          <td class="menu">
             <a href="#/home">Home</a>
             <a href="#/trainings">Trainings</a>
             <a href="#/students">Students</a>
          </td>
          <td class="container">
             <ng-view></ng-view>
          </td>
       </tr>
       <tr>
          <td colspan="2" class="footer">
            <h1>Website Footer</h1>
          </td>
       </tr>
    </table>

  </body>
</html>

No comments:

Post a Comment

Note: only a member of this blog may post a comment.