Question

我尝试在angular.page上将angularjs与fullpage.js结合起来。此外，仍有一些页面正常通过路线呈现。

这是我在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: '/'
    });
});

但是，当我滚动索引处的部分时，每个部分都调用我的第一个路径规则，然后渲染索引页面，但该部分已正确滚动到。

此外，当设置html5Mode为true时，带有哈希标记的路由规则似乎不起作用，我的网址变为http://xxx/%23products，如何解决此问题？

感谢。

Answer 1

好的，我通过一些黑客解决了它。

首先，我设置了标志＆＃39; lockAnchors ＆＃39;要真实的＆＃39;在fullpage.js。

其次，我将控制器设置为navbar指令，它提供 $ scope.scrollTo（锚点），然后点击并调用scrollTo（锚点）后，我使用 ngSilent 默默地更改网址。

最后，我查看单击导航栏的页面。如果不是带有fullpage.js的索引页面，我使用 $ location.path（＆＃34; /＆＃34;）返回索引，然后以静默方式将锚点添加到网址中，使用fullpage.js方法滚动到锚点（超时后约1200~1500）。

angularjs with fullpage.js锚点和路由（复杂）

1 个答案: