title: The URL changes back to the previous URL after the page from the current URL is loaded
body: <p>First my URL IS:</p>
  
  <pre><code> /pages/check_info/add_info
  </code></pre>
  
  <p>after clicking the button in that pages it loads URL: </p>
  
  <pre><code>/pages/check_info/add_visitor.
  </code></pre>
  
  <p>the problem is that after the form has been loaded of <code>add_visitor</code> the URL changes back to</p>
  
  <p><code>/pages/check_info/add_info</code> </p>
  
  <p>but the <code>add_visitor</code> page is still there.
  Now when I click a button that links back to <code>add_info</code> the button does not redirect anywhere as the current URL is the same</p>
  
  <p>The code i have used for the button is</p>
  
  <pre><code>     &lt;div class="btn-area"&gt;
        &lt;button md-raised-button class="btn btn-primary btn-rounded"
        type="submit"&gt;PLEASE CHECK IN&lt;/button&gt;
        &lt;a  routerLink='/pages/check-info/add_info'&gt;BACK&lt;/a&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>The code i have used for routing:</p>
  
  <pre><code> const routes: Routes = [
  
  
     {path: '',redirectTo: 'add_info', pathMatch: 'full'},
    {path: 'add_info', component: AddInfoComponent},
    {path: 'display_info', component: DisplayInfoComponent},
    {path: 'add_visitor', component: AddVisitorComponent},
    {path: 'search_student', component: SearchStudentComponent},
    {path: 'add_student', component: AddStudentComponent},
    {path: 'add_graduate', component: AddGraduateComponent},
    {path: 'check-in', component: AddInfoComponent},
  
  ];
  </code></pre>