1

我的 angularJS Webapp 有两个主要问题。

  1. 我希望当路线改变(或页面正在改变)时浏览器滚动到顶部 - 目前它正在记住位置 - 这有点烦人。

  2. 我有一个单页,子页面上有 3 个不同的选项卡。我可以使用 ng-click 功能和平滑滚动(锚点)浏览它们

我的问题是,我想让这个锚标签显示在 url 中,例如:about/section1 about/section2 about/section3

目前都停留在“约”

这是我的设置:

// 3 Ng click funtions to navigate in the submenue to the sections (all in one page) - but they not showing up in the url tag! 

    angular.module('testApp')
      .value('duScrollDuration', 2000)
      .value('duScrollOffset', 122)
      .controller('ankerCtrl', function($scope, $document){

        var container = angular.element(document.getElementById('container'));
        $scope.toTheTop = function() {
          container.scrollTop(0, 5000);

        }
        $scope.toSection1 = function() {
          console.log("hallooo ich will zu section 1");
          var someElement = angular.element(document.getElementById('section-1'));
          $document.scrollToElementAnimated(someElement);
        }
        $scope.toSection2 = function() {
          console.log("hallooo ich will zu section 2");
          var someElement = angular.element(document.getElementById('section-2'));
          $document.scrollToElementAnimated(someElement);
        }
        $scope.toSection3 = function() {
          console.log("hallooo ich will zu section 3");

          var someElement = angular.element(document.getElementById('section-3'));
          $document.scrollToElementAnimated(someElement);
        }
      }
    );

//Routing
.config(function ($urlRouterProvider, $stateProvider, $anchorScrollProvider) {
    $stateProvider
      .state('about', {
        url: "/about",
        views: {
          'content': {
            templateUrl: 'views/about.html',
            controller: 'MainCtrl'
          },
          'subnavi': {
            templateUrl: 'views/subnavi-about.html'
          }
        }
      }).state('unternehmen', {
        url: "/unternehmen",
        views: {
          'content': {
            templateUrl: 'views/unternehmen.html',
            controller: 'MainCtrl'
          },
          'subnavi': {
            templateUrl: 'views/subnavi-unternehmen.html'
          }
        }
      })
      .state('main', {
        url: "/",
        views: {
          'content': {
            templateUrl: 'views/main.html'
          }
        }
      });

    $urlRouterProvider.otherwise('/');
    $anchorScrollProvider.disableAutoScrolling();

  });

非常感谢你的帮助!

(再次: 1. 滚动到顶部 2. 子锚不会出现在 url 标签中

4

0 回答 0