Подтвердить что ты не робот

Несколько вложенных u-view с ui-router и AngularJS

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

У меня установлен следующий $stateProvider:

$stateProvider.
    state('root', {
        url: '',
        views: {
            'ViewA': {
                templateUrl: 'ViewA.html',
                controller: ViewAController
            },
            'ViewB': {
                templateUrl: 'ViewB.html',
                controller: ViewBController
            },
            'ViewC': {
                templateUrl: 'ViewC.html',
                controller: ViewCContoller
            }
        }
    });

И следующее: index.Html:

<head>
    <title>Angular PoC</title>       
</head>
<body ng-controller="DashboardController">
    <!-- Account View for logging in -->
    <div ui-view="ViewA" ng-hide="currentlyLoggedIn"></div>

     <!-- Used to toggle the two main views -->
    <div ng-show="currentlyLoggedIn">
        <button ng-click="activateViewB()"> View B </button> 
        <button ng-click="activateViewC()"> View C </button>
    </div>

    <!-- These are the two main views -->
    <div ui-view="ViewB" ng-show="currentlyLoggedIn && currentViewB"></div>
    <div ui-view="ViewC" ng-show="currentlyLoggedIn && currentViewC"></div>
</body>

Это ViewC.html:

<div>
    This is ViewC
    <div ui-view="ViewCDetails"></div>
</div>

Мне нужно, чтобы все ViewA, B, C в основном действовали независимо друг от друга, в основном каждый из них имеет свои собственные машины состояний. Им нужно, чтобы все были в одной и той же точке зрения, потому что все трое должны сохранять свое состояние, даже когда меняется один из других. Самая большая проблема, с которой я сталкиваюсь, заключается в том, что я не могу инициализировать "ViewCDetails", и я не могу добавить какие-либо состояния, которые влияют на одно из представлений, не мешая другим двум представлениям. Есть ли способ добавить состояния, которые влияют только на один из Представлений без неблагоприятного воздействия на два других представления? Также следует отметить, что это должен быть SPA, поэтому он не управляется URL.

4b9b3361

Ответ 1

$stateProvider.
    state('root', {
        url: '',
        views: {
            'ViewA': {
                templateUrl: 'ViewA.html',
                controller: ViewAController
            },
            'ViewB': {
                templateUrl: 'ViewB.html',
                controller: ViewBController
            },
            'ViewC': {
                templateUrl: 'ViewC.html',
                controller: ViewCContoller
            },
            '[email protected]': {
                templateUrl: 'ViewCDetails.html',
                controller: ...
            }
        }
    });

https://github.com/angular-ui/ui-router/wiki/Multiple-Named-Views