angular state refresh-page does not work in browser


I have angular app with routing: <base href="/application/">

            .state('main', {
                url: '/',
                templateUrl: 'js/templates/main.html'
            .state('main.admin', {
                url: '^/admin',
                templateUrl: 'js/templates/admin-page.html',
                controller: 'AdminController'

When I use links like

<li role="presentation" ui-sref-active="active">
                <a href class="custom-tab-label" ui-sref="main.admin"Admin</a>

all works fine. link is http://localhost:8080/application/admin

But when I try to refresh this page – there is 404 error.

Where is the problem?


you need to instruct your server-side to use angular routing… here is a link on how to do it…

e.g. in IIS

      <rule name="Main Rule" stopProcessing="true">
        <match url=".*" />
        <conditions logicalGrouping="MatchAll">
          <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />                                 
          <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
        <action type="Rewrite" url="/" />

Answered By – harishr

Answer Checked By – Katrina (AngularFixing Volunteer)

Leave a Reply

Your email address will not be published.