Bootstrap tab redirects me to another HTML page

问题

I've been working on a tab feature of my AngularJS program and I've come across an issue with the HTML coding for said feature. Effectively when I load the page, the information is presented as I would like it to be. However, once I click on the tab it redirects me to the main page of the application I'm working on. Am I missing anything which is causing me this bug?

<div class="profile-body">
  <div class="col-lg-12">
    <div class="tabbable">
      <ul class="nav nav-tabs tabs-flat  nav-justified" id="myTab11">
        <li class="active">
          <a href="#overview" data-toggle="tab">
            Tab 
          </a>
        </li>
        <li class="tab-red">
          <a href="#timeline" data-toggle="tab">
              Tab Tab
          </a>
        </li>
      </ul>
      <div class="tab-content tabs-flat">
        <div class="tab-pane active" id="overview">
          <div class="row">
            <!--Information-->
          </div>
          <div id="timeline" class="tab-pane">
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

回答1:

Instead of using bootstrap you should use UI bootstrap which supports AngularJS. The attribute href="#overview" does create the redirect you talking about.

View

<div ng-controller="MyCtrl">
  <uib-tabset active="active">
    <uib-tab index="0" heading="Static title">Static content</uib-tab>
    <uib-tab index="$index + 1" 
             ng-repeat="tab in tabs" 
             heading="{{tab.title}}" 
             disable="tab.disabled">
      {{tab.content}}
    </uib-tab>
    <uib-tab index="3" select="alertMe()">
      <uib-tab-heading>
        <i class="glyphicon glyphicon-bell"></i> Alert!
      </uib-tab-heading>
      I've got an HTML heading, and a select callback. Pretty cool!
    </uib-tab>
  </uib-tabset>
</div>

AngularJS application

var myApp = angular.module('myApp', ['ui.bootstrap']);

myApp.controller('MyCtrl', function($scope) {
    $scope.tabs = [
    { title:'Dynamic Title 1', content:'Dynamic content 1' },
    { title:'Dynamic Title 2', content:'Dynamic content 2', disabled: true }
  ];
});

> demo fiddle

来源：https://stackoverflow.com/questions/49274560/bootstrap-tab-redirects-me-to-another-html-page