angularjs with fullpage.js anchor and routing(complex) - angularjs

Question

I try to combine angularjs with fullpage.js on the index.page. Also, there are still some pages just rendered normally by route.
Here is my route in app.js
app.config(['$routeProvider', '$httpProvider', '$locationProvider', function($routeProvider, $httpProvider, $locationProvider) {
$locationProvider.html5Mode(true);
$routeProvider
// Below are all sections at index page
.when('/#index', {
controller: 'WelcomeCtrl',
templateUrl: 'views/welcome/index.html'
})
.when('/#products', {
})
.when('/#learn', {
})
.when('/#help', {
})
.when('/#contact', {
})
// Other pages not using fullpage.js
.when('/cases', {
controller: 'CasesCtrl',
templateUrl: 'views/welcome/cases/index.html'
})
.when('/users', {
controller: 'UsersCtrl',
templateUrl: 'views/users/login.html'
})
.otherwise({
redirectTo: '/'
});
});
However, when I scroll the sections at the index, each calls my first routes rule, then renders the index page though the section is been correctly scrolled to.
Besides, the route rules with hash tags seems not working when setting the html5Mode true, I got urls become http://xxx/%23products, how to resolve this problem?
Thanks.

Answer 1

OK, I solved it by some hack.
First, I set the flag 'lockAnchors' to be 'true' in fullpage.js.
Second, I set a controller to the navbar directive, which provides a $scope.scrollTo(anchor), then after click and call scrollTo(anchor), I use ngSilent to silently change the url.
Finally, I check which page where I click the navbar.
If not the index page with fullpage.js, I use $location.path("/") to back to the index, then silently add the anchor to the url, with using fullpage.js method to scroll to the anchor(after a timeout about 1200~1500).