angularjs назвал ui-views обновляя только один ui-view

0

Я использую AngularJS 1.5.8 и ui-router, и у меня есть меню слева и область содержимого справа.

Я хочу, чтобы возможность перемещаться по системе меню без обновления "контента" ui-view, возможно ли это?

В моем index.html у меня есть эти два ui-views

  <div ui-view="menu"></div>
  <div class="content" ui-view="content"></div>

Тогда в моих настройках файла маршрута у меня есть следующее:

settingsRoute = function($stateProvider, $urlRouterProvider){
    $stateProvider
        .state('settings', {
            url: '/settings',
            views: {
                "menu": {templateUrl: 'templates/settings.html'}
            }
        })
        .state('account', {
            url: "/account",
            views: {
                "menu": {templateUrl: 'templates/settings.html'},
                "content": {
                    templateUrl: 'templates/account.html',
                    controller: 'account'
                }
            }
        });
    $urlRouterProvider.otherwise('/account');
}

В моем файле маршрутизации расходов у меня есть

costingsRoute = function($stateProvider){
    $stateProvider
        .state('costings', {
            url: '/costings',
            views: {
                "menu": {templateUrl: 'templates/costings.html'}
            }
        })
        .state('invoices', {
            url: '/invoices',
            views: {
                "menu": {templateUrl: 'templates/costings.html'},
                "content": {
                    templateUrl: 'templates/invoices.html'
                }
            }
        })
}

angular.module('app').config(costingsRoute);

Например, в следующей демонстрационной версии, когда она загружает его, загружается тело учетной записи, отображаемое в контенте, когда я нажимаю "затраты", я хотел бы, чтобы это только изменило меню и оставило представление содержимого тем, что находится в представлении содержимого, это может быть "тело счета" или "тело профиля".

https://plnkr.co/f7A773GJdu3NWy3Lg2eK

Теги:
angular-ui-router

1 ответ

0

добавьте это в свой калькулятор...

https://plnkr.co/edit/Q2nXXWpSywkdEUKIUmC0?p=preview

.state('costings', {
            url: '/costings',
            views: {
                "menu": {templateUrl: 'costings.html'},
                "content": {
                    templateUrl: 'account.html'
                }
            }
        })
  • 0
    Я хотел бы, чтобы он помнил, на какой странице я нахожусь. Так что, если у меня есть другая страница, например, профиль, и я нахожусь на странице профиля, и я переключаюсь в меню калькуляций, то оно должно продолжать отображать страницу профиля.
Сообщество Overcoder
Наверх
Меню