0

this is related to AngularJS 1.0.7 in html5Mode get 404 error when refresh page . But, actually the problem I depicted in that post is fixed, but after that, new errors has come. So, I have marked the previous one as ok, and I will explain my new error:

To summarize, page refresh is now working, however some functionalities related to links have stopped working. I post an example code:

HTML

   <li ng-show="logged" class="dropdown">       
        <a href="#" class="dropdown-toggle" data-toggle="dropdown" style="padding-top: 10px; padding-bottom: 5px">
            <img ng-show="user.mainPhoto" src="//{{S3_BUCKET}}.{{PHOTO_SERVER_URL}}/img/users/{{user.id}}/{{user.mainPhoto.id}}.{{user.mainPhoto.mime}}" style="height: 30px; width: 30px;" class="img-circle"/>
            <i ng-hide="user.mainPhoto" class="fa-icon-user" style="font-size: 22px;margin-right: 5px"></i>
            {{user.name}}
            <span class="badge" style="background-color: rgb(41, 169, 223)" ng-show="userAlerts.length > 0">{{userAlerts.length}}</span> 
            <b class="caret" style="margin-top: 14px"></b>
        </a>
        <ul class="dropdown-menu">
          <li><a href="#" tabindex="-1" ng-click="goToProfile()">{{'PROFILE' | translate}}</a></li>
          <li class="divider"></li>
          <li><a tabindex="-1" href="" ng-click="logout()">{{'LOGOUT' | translate}}</a></li>
        </ul>                                       
    </li>

JS

login.js

$scope.goToProfile = function(){
    $location.search({});
    $location.path('/user-dashboard');
};

app.js:

angular.module('myApp', ['myApp.filters', 'myApp.services', 'myApp.directives', 'myApp.controllers']) .config(['$routeProvider', '$httpProvider', '$locationProvider',function($routeProvider, $httpProvider, $locationProvider) {

// use the HTML5 History API
$locationProvider.html5Mode(true);   

$httpProvider.defaults.useXDomain = true;
delete $httpProvider.defaults.headers.common["X-Requested-With"];           

$routeProvider.when('/', {templateUrl: 'partials/home.html', controller: 'HomeCtrl'});      
$routeProvider.when('/about', {templateUrl: 'partials/about.html', controller: 'AboutCtrl'});    
$routeProvider.when('/contact', {templateUrl: 'partials/contact.html', controller: 'HomeCtrl'});
$routeProvider.when('/home', {templateUrl: 'partials/home.html', controller: 'HomeCtrl'});
$routeProvider.when('/user-dashboard', {templateUrl: 'partials/user-dashboard.html', controller: 'UserDashboardCtrl'});       
$routeProvider.when('/user-dashboard#tabProfile', {templateUrl: 'partials/user-dashboard.html#tabProfile', controller: 'UserDashboardCtrl'});
$routeProvider.otherwise({redirectTo: '/'}); 
  }])

Nginx config file (only relevant part):

server {
        listen       80;
        server_name  localhost;

        #charset koi8-r;
        access_log  logs/host.access.log;
        rewrite_log on;
        location / {
            root   /Users/Rober/Projects/yanpy/dev/yanpy/app;
            index  index.html index.htm;
            try_files $uri $uri/ /index.html =404;
        }

When I click on the link that goToProfile, to navigate to user dashboard, I´m just redirected to index. Note: For other links or actions is navigating correctly.

1 Answer 1

0

Fixed it by removing the href="#". You have to remove it completely, if you just do href="" it doesn´t work.

Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.