может ли data-target работать с роутером

Question

Я очень новичок в разработке внешнего интерфейса, и в настоящее время пытаюсь решить проблему с навигационными вкладками

var app = angular.module('myApp', ['ui.bootstrap', 'angularFileUpload', 'ngRoute', 'ngTagsInput', 'http-auth-interceptor']);
var xeditableModule = angular.module('xeditable', []);

xeditableModule.run(function(editableOptions) {
    editableOptions.theme = 'bs3'; 
});


app.config(function ($routeProvider) {
    $routeProvider
        .when('/foo',
        {
            controller: 'FooController',
            templateUrl: 'app/partials/foo.html'
        })
        .when('/bar',
        {
            controller: 'Controller',
            templateUrl: 'app/partials/bar.html'
        })
    });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div class="panel-heading">
    <ul class="nav nav-tabs">
        <li class="active"><a data-target="#foo" data-toggle="tab" onclick="return false;">foo</a></li>
        <li><a data-target="#bar" data-toggle="tab" onclick="return false;">bar</a></li>
    </ul>
</div>

Я хотел бы, чтобы мои вкладки загружали партиалы с помощью логики контроллера, и я попытался с

<a href="#bar" data-toggle="tab" onclick="return false;">bar</a></li>

Это тоже не работает.

Я хотел бы знать, что я делаю неправильно. Пожалуйста, задавайте любые вопросы, если того, что я описываю, недостаточно, поскольку я очень новичок в разработке переднего плана.