0

ブートストラップ タブのディレクティブを作成して、タブを表示し、change-selection のパラメーターとして渡された URL に基づいてルートを切り替えました。

タブをクリックするたびにビューが読み込まれ、ページ全体が一番上にスクロールします。ページのスクロールを無効にしようとしていますが、何を試しても機能しません。

どんな助けでも大歓迎です。

JS コード: 

var reportApp = angular.module('reportApp', [])
//Disable anchorScroll
.value('$anchorScroll', angular.noop)
.config(
  ['$routeProvider', function ($routeProvider) {
      $routeProvider.when("/", {
        templateUrl: "t1.html",
        controller: 'T1Ctrl'}
      )
      ...
 }

//Directive to switch tab
reportApp.directive('changeSelection', function ($location) {
        return function (scope, element, attr) {
            element.bind('click', function (e) {
                e.preventDefault();
                $(element).tab('show');
                $location.path(attr.changeSelection);
                scope.$apply();
            });
        }
    }
);

HTML: 

<div id="tabContainer" class="span12">
    <ul class="nav nav-tabs" id="reportTabs">
        <li class="active"><a href="#" change-selection="/tendencies">Tab2</a></li>
    </ul>
</div>
<div class="tab-content">
    <div data-ng-view></div>
</div>
4

2 に答える 2

1

タブのコンテンツ div にスタイルを追加することになりました。これにより、div のサイズ変更とブラウザーの更新が防止されます。結局、angularjsとは何の関係もありませんでした。

変更元:

<div class="tab-content">
    <div data-ng-view></div>
</div>

に：

<div class="tab-content" style="min-height: 500px">
    <div data-ng-view></div>
</div>
于 2013-09-12T20:38:29.713 に答える