Меню вкладок ngRoute после входа в AngularJS 1.7.x

Question

У меня есть ngRoute, который направляет пользователей на странице входа в систему, и в случае успешного входа пользователь может попасть на страницу панели управления.

Проблема в том, что на странице панели инструментов мне нужны две или более вкладки, которые отображают (просмотр) HTML-страницы, загруженной из контроллера памяти.Один важный момент в сценариях angularjs, как я следовал в некоторых примерах, это то, что мне нужно использовать на странице индекса для отображения содержимого вкладок.Но я хочу и должен визуализировать представление по вкладкам на странице панели инструментов: потому что индекс используется для механизма входа в систему.

Я потратил много времени, чтобы достичь этого, следуя примеру и учебному пособию, и это, кажется, самая трудная часть всего моего проекта.Что мне нужно, это дочерний маршрут внутри страницы dashbord.Возможно, я бы не стал переходить с ngRoute на Ui-router.Я ищу простое решение.

код:

var app = angular.module('main', ['ngRoute', 'ui.bootstrap']);

app.config(function($routeProvider, $locationProvider) {

$routeProvider.when('/', {
    templateUrl: 'components/home.html',
    controller: 'homeCtrl'
})
.when('/logout', {
    resolve: {
        deadResolve: function($location, user) {
            user.clearData();
            $location.path('/');
        }
    }

})
.when('/login', {
    templateUrl: 'components/login.html',
    controller: 'loginCtrl'

})
.when('/dashboard', {
    resolve: {
        check: function($location, user) {
            if(!user.isUserLoggedIn()) {
                $location.path('/login');
            }
        },
    },
    templateUrl: 'components/dashboard.html',
    controller: 'dashboardCtrl'
    // it is possible a child route for two tabs??
})

.otherwise({
    template: '4045'
});


$locationProvider.html5Mode({
 enabled: true,
 requireBase: true
});

$locationProvider.html5Mode(true);

});


    Controller

    app.controller('dashboardCtrl', function($scope, $location, user, $http,  $window) {

    $scope.tabs = [
                    {
                        title: "Visualized",
                                templateUrl: 'components/trax.html',
                                controller:'testCtrl'
                    },
                    {
                        title: "Pure JSON",
                        templateUrl: 'components/trax2.html'
                    }
                        ,
                    {
                        title: "Other",
                        templateUrl: 'json.html'
                    }
                ]
     //...
});



what i try:


  <tabset justified="true">
    <tab ng-repeat="tab in tabs" heading="{{ tab.title }}" active="tab.active">
         <div ng-include="tab.templateUrl"></div>
    </tab>
</tabset>

Так что нг-вкл рендеринг хорошо HTML-страницы, но без функции контроллера.

Можете ли вы поставить меня правильнонаправление для достижения этой, по-видимому, легкой вкладки на целевой странице, если успешный вход в систему?

Спасибо!

Answer 1

Столь простое решение большой проблемы по директиве Потрясающие надеюсь помочь. спасибо

  <uib-tabset>
      <uib-tab ng-repeat="tab in tabs" heading="{{tab.title}}" active="tab.active" select="onTabSelected(tab.slug)">
        <div ng-include="tab.templateUrl"></div>  </uib-tab>
      </uib-tabset>
      <div ng-controller="testCtrl">

      {{nome}}

        <div>